jQuery使用自定义ID名称多次追加?有人可以向我发送正确的方向

时间:2018-10-30 10:52:14

标签: jquery

我是jquery新手,正在尝试创建过滤器。 我有一个过滤器按钮来添加另一个过滤器,这一切正常,但是P get的ID相同。这是合乎逻辑的。

有人可以按照正确的方向给我发送每个ID自己的号码吗? 假设某人单击该按钮10次,则每个ID分别获得1,2,3,4,5,6,7,8,9,10,因此我可以使用jquery再次定位这些目标。

这是我的脚本:

<script>
$(document).ready(function(){
    $("#Filter2").click(function(){
      $("#Filter2div").css("display", "inline;");
    $("#FilterP").append('<p id="and-or-"><p ID="Attribute2-"></p><p 
id="Operator-Value2-"></p><p ID="Filter_Value2-"></p>' );
$("#Filter2div").append('<br><select ID="andor" onchange="Andor(this)"> <option value="Select">Select</option><option value="-and">-and</option><option value="-or">-or</option></select><input ID="AttributeValue2" Placeholder="Filterable Property"></input><select ID="Operator2" onchange="PS_Operator2(this)"><option value="Select">Select</option><option value="-eq">-eq</option><option value="-ne">-ne</option><option value="-like">-like</option><option value="-notlike">-notlike</option><option value="-ge">-ge</option><option value="-le">-le</option></select><input ID="Filterable_Value2" Placeholder="Filterable Value"></input>'  );

 });
});

HTML部分:

<div ID="Full_Filter">
<pre><p ID="OptionValue"></p> -Filter {<p ID="Attribute"></p><p id="Operator- 
Value"></p><p ID="Filter_Value"></p><p id="FilterP"></p>}</pre>
</div>

1 个答案:

答案 0 :(得分:1)

我不太了解您的代码应该如何工作,因为它依赖于$("#Filter2").click(function(){ HTML中不存在的元素上的click函数。

但是,这是一个基本示例,说明如何使用类选择动态创建的元素,并使用jQuery的length对其进行计数并基于此计数创建新的id:

$(document).ready(function(){
  var container = $('#container');
  $('#addButton').on('click', function(){
    var count = $('.addedElement').length;
    container.append('<div id="id-' + count + '" class="addedElement">Element with id "id-' + count + '"</div>');
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button id="addButton">ADD</button>
<div id="container"></div>