Question

我有一个要求，即当两个文本输入字段中的文本都相同时，我需要显示一个标记为Set的按钮。我能够显示动态创建的按钮Set单击Validate按钮。

我看到的唯一问题是，如果单击“验证”按钮，则会多次添加“设置”按钮

$(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 {

            }
        }
    });

});

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

提前致谢。

Answer 1

在jquery中使用length来查找该元素是否已创建

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

Answer 2

只需添加if语句即可验证仅在#setthiscategory不存在时才执行操作：

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

希望有所帮助。

Answer 3

试试这个..

<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>

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

3 个答案: