Javascript 如何在单击按钮后停止触发事件

我编写了一个函数，用于在用户单击按钮时显示两个文本框。但问题是，当单击这两个按钮时，会触发表单中另一个按钮的事件。所以我为隐藏和显示函数编写了一个鼠标点击事件。但它仍然不起作用。单击“显示”按钮时，将显示两个文本框，单击“隐藏”按钮时，这些文本框将消失。我会在下面写下我的代码

     <div class="form-group">
            <div class="col-sm-9">
              <input type="text" id="height"/>
                <input type="text" id="width"/>

                <button id="hide">Hide</button>
                <button id="show">Show</button>


        </div>
    </div>

$("show").click(function(){ #Mouse Click event for show button


  $(document).ready(function(){
     $("#input1").hide();
             $("#input2").hide();
        $("#hide").click(function(){
            $("#input1").hide();
             $("#input2").hide();
        });
        $("#show").click(function(){
            $("#input1").show();
             $("#input2").show();
        });
    });

    });

试试这个

$document.readyfunction{ $height，width.hide； $hide.clickfunction{ $height，width.hide； }; $show.clickfunction{ $height，width.show； }; }; 隐藏 显示

---

只需在document.ready中调用click函数。还可以使用适当的选择器在适当的元素上触发事件

$document.readyfunction{ $hide.clickfunction{ $height，width.hide； }; $show.clickfunction{ $height，width.show； }; }; 隐藏 显示

---

JS中的元素ID与HTML不匹配。此外，将文档就绪处理程序放在单击处理程序中也没有意义。另外$show正在寻找一个元素，您需要一个与其他代码中相同的元素。谢谢您的回答。但cart函数的事件仍在触发。当我单击“显示”或“隐藏”按钮时，它仍然会导航到购物车，因为下面有一个名为“添加到购物车”的按钮。你知道如何阻止这种情况发生吗@阴影Fiend@RyanOscar加上这个。。。这是因为如果按钮在表单中，它仍然充当提交。。您需要首先指定它的类型。。我编辑了我的答案。现在它不再重定向到购物车页面。但现在还有一个陷阱。显示和隐藏按钮现在不起作用。它应该在单击“显示”时显示两个文本框，在单击“隐藏”时显示“隐藏”@阴影Fiend@RyanOscar你能发布完整的html和js吗？这样我就可以找到问题所在。。或者只是影响函数的相关代码。@RyanOscar由于选择错误，单击函数无法工作。。您的id是高度和宽度，而不是输入1和输入2。。用我在答案中所做的jquery更改您的jquery，它应该可以工作。。