Question

我有一个带有6个单选按钮的问题，所以它们被编码为1,2,3,4,5,99，还有一个文本框可以输入逐字回答。如果已选择代码1-5，则文本框中的值将消失，如果选择代码99，则会显示文本框中的答案。

但是，只要我单击文本框编辑之前输入的逐字词，文本框中的所有文本都将消失，

文本框的ID为：Q6_99_other

以下是剧本：

var txt = "";
$('#fieldset_Q6 input').parent().each(function () {
    $(this).click(function () {
        //alert('checked');

        $('#Q6_99_other').on('keyup change', function () {
            txt = this.value;
        })

        var id = $(this).children().attr('id');
        if (id == 'Q6_1_99') {
            $('#Q6_99_other').val(txt);
        } else {
            $('#Q6_99_other').val('');
        }

    });
});

有任何建议吗？也许我需要修改脚本的“keyup change”部分？

非常感谢，罗伊

Answer 1

单击文本框时，单击事件会冒泡到父元素。这将运行您编写的单击处理程序。由于子项的ID不是Q6_1_99，因此会执行$('#Q6_99_other').val('')，这会清除文本字段。

您可以使用以下方法阻止此冒泡：

$("#Q6_99_other").click(function(e) {
    e.stopPropagation();
    this.focus();
});

此外，您可能不应该在单击处理程序中具有keyup change绑定。这意味着每次用户点击父级时，它都会绑定文本框上的另一个keyup change处理程序。您只需要执行一次，而不是每次都单击。只需在顶级document.ready处理程序中执行此操作。

您也不需要使用.each()将处理程序绑定到所有元素。事件绑定函数可以应用于集合，jQuery会自动迭代它们。

单击时，表单值消失

1 个答案: