Javascript 单击时将输入框添加到div.html

Javascript 单击时将输入框添加到div.html,javascript,jquery,Javascript,Jquery,我有一个简单的jQuery脚本设置,可以在单击div时向div添加一个输入框。 唯一的问题是,当我点击输入框添加文本时,它认为我再次点击了div,并尝试再次添加输入框,而不允许我添加文本 $(".match").click(function() { var match_id = $(this).find(".match_id").text(); $(this).find("#bet").html("<div><input type='text'></

我有一个简单的jQuery脚本设置,可以在单击div时向div添加一个输入框。 唯一的问题是,当我点击输入框添加文本时,它认为我再次点击了div,并尝试再次添加输入框,而不允许我添加文本

$(".match").click(function() {
    var match_id = $(this).find(".match_id").text();
    $(this).find("#bet").html("<div><input type='text'></div>");
});
$(“.match”)。单击(函数(){
var match_id=$(this.find(“.match_id”).text();
$(this.find(“#bet”).html(“”);
});

有没有办法解决这个问题?

问题是输入在div中。因此,您需要阻止click事件传播到div

尝试添加以下内容:

$('.match input').click(function(e) {
    e.stopPropagation();
    e.cancelBubble = true;
});
或者,如果您只希望向div添加一个输入,则可以将事件侦听器更改为:

$('.match').one('click', function() {
    ...
});

将执行事件侦听器,然后立即将其从该元素中删除,因此对于每个匹配的元素,它最多只执行一次。

问题在于输入在div中。因此,您需要停止click事件传播到div

尝试添加以下内容:

$('.match input').click(function(e) {
    e.stopPropagation();
    e.cancelBubble = true;
});
或者,如果您只希望向div添加一个输入,则可以将事件侦听器更改为:

$('.match').one('click', function() {
    ...
});

将执行事件侦听器,然后立即将其从该元素中删除,因此它最多只对每个匹配的元素执行一次。

是否只添加一次输入?单击的每个
.match
div一次。是否只添加一次输入?单击的每个
.match
div一次。兄弟,你发布的最后一个脚本效果非常好!我真不敢相信我从来没有见过这样的场景。兄弟,你发布的最后一个脚本非常棒!我真不敢相信我从没见过有人用它。