Jquery 追加到 (动态由 id ）

Jquery append to (dynamic by id)

本文关键字：id 动态 追加 Jquery      更新时间：2023-09-26

假设我有id 参数表和两个选择框的功能

<select id="one" onchange="Fill(2)"></select>
<select id="two" onchange="Fill(3)"></select>
<select id="three"></select>

我的函数

function Fill(id){  
//some manupulation
$('<option/>').val(substr[0]).html(substr[1]).appendTo('#two');
}

但不是做很多 

if(id==2) {$('<option/>').val(substr[0]).html(substr[1]).appendTo('#two');}
if(id==3) {$('<option/>').val(substr[0]).html(substr[1]).appendTo('#three');}

我想要类似的东西

$('<option/>').val(substr[0]).html(substr[1]).appendTo(DYNAMIC);

你可以通过使用 id(如 select-1、select-2 等(来简化它，然后使用 '#select-' + id 。

否则，您需要一个从数字映射到拼写数字的映射对象。

function Fill(id){  
  var index = {
    1: 'one',
    2: 'two',
    3: 'three'; 
  };
  $('<option/>').val(substr[0]).html(substr[1]).appendTo('#' + index[id]);
  // or just, but in this case you need to change the *id* pattern like opt_1, opt_2 etc
  $('<option/>').val(substr[0]).html(substr[1]).appendTo('#opt_' + id);
}

比你想象的要容易:)

<select id="select-1" onchange="Fill(2)"></select>
<select id="select-2" onchange="Fill(3)"></select>
<select id="select-3"></select>
function Fill(id){ // 
    //some manupulation
    $('<option/>').val(substr[0]).html(substr[1]).appendTo('select-' + id);
}

我将接受David Thomas的建议：

<select id="one" onchange="Fill(this);"></select>
<select id="two" onchange="Fill(this);"></select>
<select id="three"></select>

填充函数定义为：

function Fill(select) {
    $('<option />').val(/*..*/).html(/*..*/).appendTo($(select));
}

然后，您将能够为您的选择提供您想要的任何 id，并且您不必查询 DOM 来查找对象。

将此行添加到填充函数的顶部：

 var DYNAMIC = $(this);
相关文章：