我有工作代码,可以在我点击重置按钮时重置我的表单。然而在我的代码越来越长后,我意识到它不再起作用了。
<div id="labels">
<table class="config">
<thead>
<tr>
<th colspan="4"; style= "padding-bottom: 20px; color:#6666FF; text-align:left; font-size: 1.5em">Control Buttons Configuration</th>
</tr>
<tr>
<th>Index</th>
<th>Switch</th>
<th>Response Number</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<form id="configform" name= "input" action="#" method="get">
<tr><td style="text-align: center">1</td>
<td><img src= "static/switch.png" height="100px" width="108px"></td>
<td id="small"><input style="background: white; color: black;" type="text" value="" id="number_one"></td>
<td><input style="background: white; color: black;" type="text" id="label_one"></td>
</tr>
<tr>
<td style="text-align: center">2</td>
<td><img src= "static/switch.png" height="100px" width="108px"></td>
<td id="small"><input style="background: white; color: black;" type="text" id = "number_two" value=""></td>
<td><input style="background: white; color: black;" type="text" id = "label_two"></td>
</tr>
<tr>
<td style="text-align: center">3</td>
<td><img src= "static/switch.png" height="100px" width="108px"></td>
<td id="small"><input style="background: white; color: black;" type="text" id="number_three" value=""></td>
<td><input style="background: white; color: black;" type="text" id="label_three"></td>
</tr>
<tr>
<td style="text-align: center">4</td>
<td><img src= "static/switch.png" height="100px" width="108px"></td>
<td id="small"><input style="background: white; color: black;" type="text" id="number_four" value=""></td>
<td><input style="background: white; color: black;" type="text" id="label_three"></td>
</tr>
<tr>
<td></td>
<td><input type="submit" id="configsubmit" value="Submit"></td>
</tr>
<tr>
<td><input type="reset" id="configreset" value="Reset"></td>
</tr>
</form>
</tbody>
</table>
</div>
而我的jQuery。
$('#configreset').click(function(){
$('#configform')[0].reset();
});
为了让.reset()
方法发挥作用,我是否应该在我的代码中加入一些源码?之前我使用的是。
<script src="static/jquery.min.js">
</script>
<script src="static/jquery.mobile-1.2.0.min.js">
</script>
而.reset()
方法是有效的。
目前我正在使用
<script src="static/jquery-1.9.1.min.js"></script>
<script src="static/jquery-migrate-1.1.1.min.js"></script>
<script src="static/jquery.mobile-1.3.1.min.js"></script>
这可能是其中一个原因吗?
$('#configreset').click(function(){
$('#configform')[0].reset();
});
把它放在JS fiddle中。按计划工作。
所以,上述问题都不是这里的错。也许你有一个冲突的ID问题?点击是否真的在执行?
编辑:(因为我是一个没有适当评论能力的伤心人)这不是一个直接与你的代码有关的问题。当你把它从你目前使用的页面的上下文中拿出来时,它就能正常工作,所以,与其说是特定的jQuery/javascript & 属性的表单数据的问题,不如说是其他问题。我开始把它周围的代码分成两部分,并试图找到它发生的地方。我的意思是,只是为了'确保',我想你可以...
console.log($('#configform')[0]);
在点击函数中,确保它针对的是正确的表单......
如果是的话,它必须是这里没有列出的东西。
edit part 2: One thing you could try (if it's not targeting it correctly) is use ["input:reset"] (http://api.jquery.com/reset-selector/) instead of what you are using... also, I'd suggest because it's not the target that's incorrectly working to find out what the actual click is targeting.只要打开Firebug/Developer tools,什么都可以,把它扔进
console.log($('#configreset'))
然后我们可以从那里开始。