Jquery 如何避免多次添加动态创建的按钮

我有一个要求，只有当两个文本输入字段中的文本相同时，我才需要显示一个标记为Set的按钮。 我能够显示在单击“验证”按钮时动态创建的按钮集

我看到的唯一问题是，如果单击Validate按钮，Set按钮会被添加多次

$(function () {
    $("#setcategory").hide();
    $(document).on('click', '#validate', function (event) {
        var val1 = $("#fort1text").val();
        var val2 = $("#fort2text").val();
        if (val1 != '' && val2 != '') {
            if (val1 == val2) {
                var setthiscategory = '<input type="button" id="setthiscategory" class="saveclassbtn btn blue" id="sett1cat" value="Set This Category"/>';

                $("#validate").after(setthiscategory);

            } else {

            }
        }
    });

});

$（函数（）{
$（“#设置类别”）.hide（）；
$（文档）。在（'单击'，'验证'）上，函数（事件）{
var val1=$（“#fort1text”）.val（）；
var val2=$（“#fort2text”）.val（）；
if（val1！=''&&val2！=''）{
if（val1==val2）{
var setthiscategory=''；
$（“#验证”）。之后（设置此类别）；
}否则{
}
}
});
});

请让我知道如何解决这个问题

---

提前感谢。

在jquery中使用length，以查找元素是否已创建

if($("#setthiscategory").length==0){
      $( "#validate" ).after(setthiscategory);
}

---

只需添加一个

if

语句，以验证您仅在

#setthiscategory

不存在时执行操作：

if (!$('#setthiscategory').length)
    $( "#validate" ).after(setthiscategory);

希望有帮助。

试试这个

<input type="text" id="fort1text" class="m-wrap span12" placeholder="">
    <input type="text" id="fort2text" class="m-wrap span12" placeholder="">
    <input type="button" id="validate" value="Validate">
    <script>

        $(function () {
            $("#setcategory").hide();
        });
        $(document).on('click', '#validate', function (event) { 
            var val1 = $("#fort1text").val();
            var val2 = $("#fort2text").val();
            if(val1!=''&&val2!='')
            {
            if(val1==val2)
            {  
        var setthiscategory = '<input type="button" id="setthiscategory" class="saveclassbtn btn blue" id="sett1cat" value="Set This Category"/>';
              if($("#setthiscategory").length==0)
                $( "#validate" ).after(setthiscategory);
            }
            else
            {
               $('#setthiscategory').remove();
            }
            }
        });

    </script>

$（函数（）{
$（“#设置类别”）.hide（）；
});
$（文档）。在（'click'，'#validate'，函数（事件）{
var val1=$（“#fort1text”）.val（）；
var val2=$（“#fort2text”）.val（）；
if（val1！=''&&val2！=''）
{
if（val1==val2）
{  
var setthiscategory=''；
如果（$（“#设置此类别”）。长度==0）
$（“#验证”）。之后（设置此类别）；
}
其他的
{
$（“#设置此类别”）.remove（）；
}
}
});

@PreethiJain很高兴为您提供帮助：）从jQuery 1.8开始，.size（）方法已被弃用。使用长度instead@axel.michel这是对的。将

.size（）

更改为

.length