javascript - 使用 JQuery 克隆的下拉框不保留原始行为

Question

我想做的是复制 3 个下拉框并将它们添加到原始集合的下方。

目前它可以工作，但克隆不保持原始集的功能。

原始人所做的是检查第一个下拉框的选定值，以便填充其他两个下拉列表。

Fiddle 在下面，但由于某种我无法弄清楚的原因，添加克隆似乎不起作用，它在我正在处理的页面上有效。

http://jsfiddle.net/pV6x5/6/

谢谢，

马丁

更新

更新了 fiddle ，它缺少 advancedsearch div:http://jsfiddle.net/pV6x5/7/

Answer 1

使用 jQuery live 保持事件与新元素的绑定(bind)。使用 live 它将事件绑定(bind)到所有现在和 future 的元素，其中只需定义一个更改处理程序将只绑定(bind)当前元素(您也可以在每次创建元素时重新附加事件但是为什么在 live 处理它时这样做为你)

$tags.live("change",function(){ /* your stuff here */});

UPDATE 这是 change 函数和 if block :

$(document).ready(function() 
{
$tags = $("select[name='tags']");

$tags.live("change",function()
{
    $operands = $(this).parent().find("select[name='operands']");
    $values = $(this).parent().find("select[name='values']");
if ($(this).val() == "agent") 
{

$(this).parent().find("select[name='operands'] option").remove();

$("<option>=</option>").appendTo($operands);
$("<option>!=</option>").appendTo($operands);

$(this).parent().find("select[name='values'] option").remove();
$("<option>excel</option>").appendTo($values);
$("<option>msword</option>").appendTo($values);
$("<option>ppt</option>").appendTo($values);
$("<option>pdf</option>").appendTo($values);
$("<option>image</option>").appendTo($values);
$("<option>txt</option>").appendTo($values);
$("<option>html</option>").appendTo($values);
$("<option>csv</option>").appendTo($values);
$("<option>ooxml</option>").appendTo($values);
$("<option>flash</option>").appendTo($values);
$("<option>wmf</option>").appendTo($values);
}