所以，我想克隆我的选择选项表单，当它已经满足条件时（例如，在这种情况下，用户选择"THEN"运算符），那么表单将显示固定内容（风险 - 高），隐藏特定链接（添加更多）并显示提交按钮。
困扰我的是，只有当我选择运算符时，我的代码仅适用于第一种形式。我想要的是，我希望它在添加的每个表单上执行。
例如，我需要这样的输出：
如果年龄老了，低密度脂蛋白高，高密度脂蛋白低，西斯托利高，那么 风险高
这是我的代码：
function rule(id_counter) {
if (id_counter != 0) {
var abc = $('#var_name' + id_counter).val();
} else {
var abc = $('#var_name').val();
}
$.ajax({
url: 'search_coll.php',
type: 'post',
data: {
selected_item: abc
},
success: function(response) {
if (id_counter != 0) {
$('#var_name' + id_counter).html(response);
} else {
$('#var_name').html(response);
}
},
error: function() {
console.log('Request failed.')
}
});
};
$(document).ready(function() {
var count = 1;
$('#clone').click(function() {
var ab = $('#tobecloned').clone();
ab.find('select').attr('id', function(i, val) {
return val + count;
});
ab.find('.js_variable').attr('onChange', function(i, val) {
return "rule("+ count +")";
});
$('#tab').append(ab);
count++;
});
});<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<table id="tab">
<tr id="tobecloned">
<td>
<select name="id_var[]" id="var_name" class="js_variable" onChange="rule(0)">
<option>Choose Variable</option>
<?php include "../connect.php"; $query_v=m ysqli_query($connection, "SELECT * from variables ORDER BY id_var"); while($result_v=mysqli_fetch_array($query_v, MYSQLI_ASSOC)){ ?>
<option value="<?php echo $result_v['id_var'];?>">
<?php echo $result_v[ 'var_name'];?>
</option>
<?php } ?>
</select>
</td>
<td>
<select name="coll_name">
<option>Choose Collection</option>
</select>
</td>
<td>
<select name="operator">
<option>Choose Operator</option>
<option value="AND">AND</option>
<option value="THEN">THEN</option>
</select>
</td>
</tr>
<tr id="showifthen">
<!-- i want to show this, if the user choose THEN from the last appended/cloned select operator -->
<td>
<select name="var_name">
<option>Risk</option>
</select>
</td>
<td>
<select name="coll_name">
<option>High</option>
</select>
</td>
</tr>
</table>
<a href="#" id="clone">Add More</a>
<!-- this should be hidden if user choose THEN -->
<a type="submit" id="hideatfirst" hidden>Submit</a>
<!-- i want this to be hidden at first, and shown when user choose THEN from the last appended/cloned select operator -->
</body>
</html>谢谢之前
这里有一些不对劲的地方。
选择并非都具有 ID，因此尝试更新它们的循环会将它们设置为 NaN 。
但是，您正在对集合使用 .attr('id')，无论如何，它只返回第一个 ID，而不是所有 ID。
要依次对每个元素进行操作，请使用如下.each()：
ab.find('select').each(function() {
var el = $(this)
el.attr('id', el.attr('id') + count)
});
为了在选择值更改时采取行动，您需要为其分配一个带有 .change() 的更改处理程序，例如
$('#operator').change(function() {
operatorSelect($(this))
})
在克隆每个选择时，您必须为每个选择单独分配更改处理程序，并且您可能希望禁用每个先前的运算符选择，以便对更改哪个运算符没有歧义。
我发现这是一个有趣的小转移，所以我整理了一个快速的小提琴来演示：https://jsfiddle.net/xosqw00p/