怎样在html中使用按钮改变数值

怎样在html中使用按钮改变数值,第1张

<input type="text" value="1" name=""/>

<button>点击改变</button>

<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>

<script>

window.onload=function(){//加载完成后执行

$('button').click(function(){//对button按钮进行监控,监控点击

var val=$('input').val()//获取页面中input的值

val++//input+1

$('input').val(val)//讲改变的值重新写入input

})

}

</script>

终于给你写出来了,不知符合要求不,我的思路是给每一列配备同一个id。我给的例子是,点击按钮,对应的那一列每一行数字+3

代码如下:

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<script type="text/javascript" src="../style/jquery.min.js"></script>

<meta http-equiv="Content-Type" content="text/html charset=utf-8" />

<title>无标题文档</title>

<style>

td{width:100pxheight:40pxbackground:#999 text-align:center line-height:40px}

</style>

<script>

$(document).ready(function(){

$('.col1but').click(function(){

$('tr').each(function(){

var tmp=parseInt($(this).children('#col1').text())

$(this).children('#col1').text(tmp+3)

})

})

})

</script>

</head>

<body>

<button style="height:40px width:104px" class="col1but">第一列</button><button  style="height:40px width:104px">第二列</button><button style="height:40px width:104px">第三列</button><br /><br />

<table>

<tr>

<td id="col1">1</td><td id="col2"></td><td id="col3"></td>

</tr>

<tr>

<td id="col1">2</td ><td id="col2"></td><td id="col3"></td>

</tr>

<td id="col1">3</td><td id="col2"></td><td id="col3"></td><tr>

</tr>

</table>

</body>

</html>


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7659226.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-08
下一篇 2023-04-08

发表评论

登录后才能评论

评论列表(0条)

保存