jquery JS按钮单击(窗体内部)不起作用

62lalag4  于 2023-05-17  发布在  jQuery
关注(0)|答案(3)|浏览(100)

我有一个表格里面有一个按钮。该按钮不应提交表单。应触发JS功能。
按钮:

$(document).ready(function () {

  $('.onlynumbers').keypress(function (e) {
    var charCode = (e.which) ? e.which : event.keyCode    
    if (String.fromCharCode(charCode).match(/[^0-9]/g))    
      return false;
  }); 

  $("#weiter").click(function(event) {
   if(parseInt("#wortanzahl".value) > 0){
      $("#wk").attr("disabled", false);
      alert ("Test");
    } 
    event.preventDefault();
  })
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  ...
  <button class="btn btn-success mt-3" id="weiter">Aktualisieren</button>
  ...
</form>

当我点击按钮时。什么都没发生。会是什么呢?

mec1mxoz

mec1mxoz1#

表单中的任何按钮都是默认提交的,你只需要改变

<button class="btn btn-success mt-3" id="weiter">Aktualisieren</button>

<button type="button" class="btn btn-success mt-3" id="weiter">Aktualisieren</button>
gdrx4gfi

gdrx4gfi2#

单击处理程序中的if条件的计算结果永远不会为true。删除它,你的警报就会起作用。

$(document).ready(function () {

  $('.onlynumbers').keypress(function (e) {
    var charCode = (e.which) ? e.which : event.keyCode    
    if (String.fromCharCode(charCode).match(/[^0-9]/g))    
      return false;
  }); 

  $("#weiter").click(function(event) {
      $("#wk").attr("disabled", false);
      alert ("Test");
    event.preventDefault();
  })
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  ...
  <button class="btn btn-success mt-3" id="weiter">Aktualisieren</button>
  ...
</form>
au9on6nz

au9on6nz3#

根据您提供的不完整信息,以下可能是您想要的内容:

$(document).ready(() => {
  $("#wortenForm").on("submit", (event) => {
      event.preventDefault(); // stop submission
      const val = parseInt($("#wortanzahl").val());
      $("#wk").attr("disabled", val < 0); // no need to use an if on a boolean
      alert("Test");
  })
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="wortenForm">
  <input type="number" class="onlynumbers" />
  <input type="number" id="wortanzahl" />
  <button id="wk" disabled>WK</button>
  <button type="submit " class="btn btn-success mt-3 " id="weiter ">Aktualisieren</button>
  ...
</form>

相关问题