Question

我有一个带有一些单选按钮的表单。当我更改所选单选按钮时，此脚本会显示警告

$('input[type=radio][name=shipping-h]').change(function () {
    alert("worked");
});

我有另一个脚本来附加一个具有不同值的单选按钮

$( "#addressact" ).append('<input id=new-address type=radio name=shipping-h checked>')

如果我选择新的单选按钮，则警报不起作用。

Answer 1

您要添加一个新元素，您应该使用event delegation

$(document).on('change', 'input[name=shipping-h]', function() {
    alert("worked");
    $( "#addressact" ).append('<input id="new-address"  type="radio" name="shipping-h" checked/>');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="addressact">
  <input type="radio" name="shipping-h"/>
</div>

Answer 2

附加事件仅适用于该元素，因为它在那时。如果你之后附加元素;您以前的代码（附加事件）不会再神奇地再次执行。

这意味着在附加输入后，您需要再次调用change()方法将事件附加到输入。

进一步澄清;在当前alert($('input[type=radio][name=shipping-h]'));电话之前尝试change();它可能会说undefined因为那时元素不存在

Answer 3

您正在追加脚本，因此更改事件不会与jquery绑定。您需要执行以下步骤。

$( "#addressact" ).append('<input id=new-address onchange="changeevenfun();" type=radio name=shipping-h checked>')

function changeevenfun()
{
    alert("worked");
}

Answer 4

FIDDLE

$(document).on('change', '.qwe', function() {
    if ($(this).is(":checked")) {
        alert("worked");
        $("#addressact").append("<input id='new-address' class='qwe'type='radio' name='shipping-h' />");

    }else{
        alert("not checked");
    }

});

添加了类仅供参考。

如果要附加新元素，则应使用事件委派。应该使用此$(document).on('change', 'input[name=shipping-h]', function() {

附加的单选按钮未触发事件

4 个答案: