1

我想在克隆并执行 onchange 后获取更改时选择的类和值,但它仅返回原始选择的值。请在下面找到我的代码

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Clone</title>
</head>

<body>
<div id="input1" class="clonedInput">
    <select id="fields" class="select">
        <option>Test One</option>
        <option>Test Two</option>
        <option>Test Three</option>
        <option>Test Four</option>
    </select>
</div>
<button>Clone</button>
</body>
</html>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('button').click(function(){
        var num = $('.clonedInput').length, // how many "duplicatable" input fields we currently have
            newNum  = new Number(num + 1),      // the numeric ID of the new input field being added
            newElem = $('#input' + num).clone().attr('id', 'input' + newNum).fadeIn('slow');
            newElem.find('select#fields').attr('class','select' + newNum).val('');
            $('#input' + num).after(newElem);
        })
    $('select').change(function(){
        var value = $(this).val(),
        classx = $(this).attr('class');
        console.log(value + ' | ' + classx);
        })
    })
</script>
4

2 回答 2

0

修复它的最简单方法是为 jQuery 的clone()方法提供true参数,同时克隆事件的处理程序。另一种方法是为您的事件处理程序命名并手动将其附加到您的克隆节点,或者第三种方法是使用 jQuery 的on() 方法将事件委托给您的选择标签):

newElem = $('#input' + num).clone(true);

示例 1

... 或者 ....

newElem.change(select_change_handler);
$('select').change(select_change_handler);

示例 2

... 或者 ...

$(document).on('change', 'select', function(e) {

示例 3

于 2013-06-12T08:31:26.043 回答
0

$-operator在 DOM 中第一次出现,并且它恰好是原始的。

最简单的解决方案是在 DOM 结构中的原始元素之前放置一个克隆元素。

您可以使用.before来完成

另一种解决方案是更改克隆的元素 id/name 并通过 id/name 获取值:

("#clonedElement").attr("id","myID");
于 2013-06-12T07:53:16.277 回答