javascript - 当我将变量用于选择器时,该事件不会触发
问题描述
<html>
<body>
<h1>RECEIPT</h1>
<datalist id="codes">
<?php
require_once('../../../mysqli_connect.php');
$query = "SELECT DISTINCT itemcode FROM itemcost";
$response = @mysqli_query($dbc,$query);
while($row = mysqli_fetch_array($response)){
echo '<option value="' . $row['itemcode'] . '">';
}
?>
</datalist>
<form action="receipt.php" method="POST">
<table cellspacing="10" id="tbl">
<thead>
<td>ITEM CODE:</td>
<td>ITEM NAME: </td>
<td>QUANTITY OF ITEM:</td>
</thead>
<tbody>
<tr>
<td><input type="text" list="codes" name="Item_Code1" id="setter" size="5" /></td>
<td><input type="text" name="Item_Name1" id="receiver" size="10" /></td>
<td><input type="text" name="Quantity_In1" size="5" /></td>
</tr>
</tbody>
</table>
<br>
<br>
<input type="number" name="rows" id="addrows" />
<button type="button" id="btn">Add More</button>
<input type="submit" name="submitted" value="Enter" />
<input type="text" name="sendtotalrows" id="totalrows" style="visibility:hidden"/>
</form>
<script src="jquery.js"></script>
<script>
$(function(){
window.rowcompare = 2;
window.previousrownumber = 1;
$('#setter').change(function(){ $.getJSON('getitemcodename.php', function(itemcodename) {
var selectedItemCode = $('#setter').val();
$('#receiver').val(itemcodename[selectedItemCode]);});});
$('#btn').on('click', function(){
var rownumber = $('#addrows').val();
rownumber = parseInt(rownumber) + window.previousrownumber;
while( rownumber >= rowcompare){
$('#tbl').find('tbody').append("<tr><td><input type=\"text\" list=\"codes\" name=\"Item_Code" + rowcompare +"\" id=\"setter" + rowcompare +"\" size=\"5\" /></td><td><input type=\"text\" name=\"Item_Name" + rowcompare +"\" id=\"receiver" + rowcompare +"\" size=\"10\" /></td><td><input type=\"text\" name=\"Quantity_In" + rowcompare +"\" size=\"5\" /></td></tr>");
$("#setter" + rowcompare).change(function(){ $.getJSON('getitemcodename.php', function(itemcodename) {
var selectedItemCode = $("#setter" + rowcompare).val();
$("#receiver" + rowcompare).val(itemcodename[selectedItemCode]);});});
rowcompare++;
}
previousrownumber = rownumber;
$('#totalrows').val(previousrownumber);
});
});
</script>
</body>
</html>
我的问题在于 while 循环内的这部分代码,我尝试将变量连接到选择器。
getitemcode.php 只返回一个键值对
$("#setter" + rowcompare).change(function(){ $.getJSON('getitemcodename.php', function(itemcodename) {
var selectedItemCode = $("#setter" + rowcompare).val();
$("#receiver" + rowcompare).val(itemcodename[selectedItemCode]);
});
});
正如标题所说,我的事件不会触发。我见过类似的问题,下面是我尝试过的答案:
var IcodeID = 'setter' + toString(rowcompare)
var InameID = 'receiver' + toString(rowcompare)
$("#" + IcodeID ).change(function(){ $.getJSON('getitemcodename.php', function(itemcodename) {
var selectedItemCode = $("#" + IcodeID ).val();
$("#" + InameID ).val(itemcodename[selectedItemCode]);
});
});
parseInt(rowcompare);
$("#setter" + ${rowcompare}).change(function(){ $.getJSON('getitemcodename.php', function(itemcodename) {
var selectedItemCode = $("#setter" + ${rowcompare}).val();
$("#receiver" + ${rowcompare}).val(itemcodename[selectedItemCode]);
});
});
parseInt(rowcompare);
$("#setter" + rowcompare).change(function(){ $.getJSON('getitemcodename.php', function(itemcodename) {
var selectedItemCode = $("#setter" + rowcompare).val();
$("#receiver" + rowcompare).val(itemcodename[selectedItemCode]);
});
});
但问题是当我尝试这个时:
$("#setter" + 2).change(function(){ $.getJSON('getitemcodename.php', function(itemcodename) {
var selectedItemCode = $("#setter" + 2).val();
$("#receiver" + 2).val(itemcodename[selectedItemCode]);
});
});
有用。任何帮助,将不胜感激。
解决方案
我从这个链接得到了解决方案:
您需要在其中包装使用递增变量的 Jquery 代码:
(function(rowcompare){ Jquery 代码 })(rowcompare);
像这样:
(function(rowcompare){
$(".code-input" + rowcompare).change(function(){ $.getJSON('getitemcodename.php', function(itemcodenamestocks) {
var selectedItemCode = $(".code-input" + rowcompare).val();
$(".code-output" + rowcompare).val(itemcodenamestocks[0][selectedItemCode]);
$(".stocks-output" + rowcompare).val(itemcodenamestocks[1][selectedItemCode]);
});
});
})(rowcompare);
它有效。
推荐阅读
- opencv - 如何通过 OpenCV 验证标记特征是否正确跟踪视频中的对象?
- java - Maven Clover Instrumentation 错误 - 意外令牌
- sql - 如何使用循环在sql表中输入数据
- javascript - 删除除单词和单词之间的空格以外的所有内容
- python - 在 pyplot 中使用 fill_between() 绘图
- javascript - 错误:解析模块“react-native/Libraries/Renderer/shims/ReactNativeComponentTree”时
- javascript - 使用 array.map() 或 array.reduce() 创建图表数组
- javascript - 500 内部服务器错误/ js 到控制器
- angular - Angular Redux @select() obs,然后我可以在我的控制器中订阅它吗?模式仍然会取消订阅我 onDestroy 吗?
- python - 在python中读取没有注释的文件