代码之家 › 专栏 › 技术社区 › bestprogrammerintheworld

我可以基于特定的arrayname动态检查当前的单选按钮数组吗?

jquery html

bestprogrammerintheworld · 技术社区 · 4 年前

假设有三列带有arraybutton数组:

html格式

<input type="radio" name="clude[1]">Include
<input type="radio" name="clude[1]">Exclude

<input type="radio" name="clude[2]">Include
<input type="radio" name="clude[2]">Exclude

<input type="radio" name="clude[3]">Include
<input type="radio" name="clude[3]">Exclude

我有这样的som html代码(确实有效):

jQuery查询:

$("div input[name='clude[1]']").live( "click", function() {
    alert('radio column1');
  });

$("div input[name='clude[2]']").live( "click", function() {
    alert('radio column2');
  });

$("div input[name='clude[3]']").live( "click", function() {
    alert('radio column3');
  });

如果我知道列总是3,这就行了。但列数是基于csv文件动态生成的,有时是两列,有时可能是14列。

我想要这样的东西:

//Go through all columns (all columns has a clude[] element with first index 1!)  
$("div input[name='clude[]']").map(function(n,i){
    $("div input[name='clude[" + (i+1) + "]']").live( "click", function() {
      alert(i);
    });      
  });

(但是这段代码不起作用,因为单选按钮是动态生成的,所以这最后一个映射等不会发生任何事情(因为jquery加载这段代码时它们不存在))

我希望你明白我的意思! 有什么办法吗?

2 回复 | 直到 4 年前

Mohamed-Yousef 4 年前

data 在这种情况下属性可以带来巨大的好处。。通过使用 $("input[name^='clude['") 选择只做一个 click 所有输入的事件

$("input[name^='clude['").on( "click", function() {
  console.log('radio' + $(this).data('num'));
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="radio" name="clude[1]" data-num="1">Include
<input type="radio" name="clude[1]" data-num="1">Exclude

<input type="radio" name="clude[2]" data-num="2">Include
<input type="radio" name="clude[2]" data-num="2">Exclude

<input type="radio" name="clude[3]" data-num="3">Include
<input type="radio" name="clude[3]" data-num="3">Exclude

webdev-dan 4 年前

您可以这样添加委托侦听器:

$('body').on('click', 'div input[name^="clude"]', function(){
  var $this=$(this),
    thisName = $this.attr('name'),
    number = thisName.split('[')[1].split(']')[0];
  alert(number);
});

它将处理所有未来的输入,这些输入将放在body中的div元素中。

推荐文章

Softly · 单选按钮未按预期取值

1 年前