Question

以下是我在html页面中的部分，即获取阈值并使用值

调用函数

<form id="distance_input" onSubmit="return false;" >  


    <p>Enter a  threshold</p>

    <div class="col-md-8" style="display: inline-block; left:-30px">
    <div class="col-md-4">
    <div class="input-group"> 

      <input type="text" class="form-control" id="usr" class="search" onkeydown="search(this)"> </input>
    <span class="input-group-addon" style="width: 50px">km</span>
    </div> 
    </div>
    <div class="col-md-4" style="padding-left:0px; margin-left:-10px">

     <input type="button" class="btn btn-success" value="Submit" id="myButton"> </input>

    </div>
    </div>
    <p>&nbsp;</p>
     </form> 
<script type="text/javascript">
$('#myButton').click(function(){
        var value = $("input[type=text]").val();
            console.log(value+ " from the submit button");
            set_to_threshold(value);


        });

    function search(ele) {
        if(event.keyCode == 13) {
            console.log(ele.value+" from enter button");   
            set_tothreshold(ele.value);

        }
    } 
</script>

但是当我这样做时，我得到的图形不会被刷新（当函数中的值传递时，set_tothreshold函数获取图形的新数据）并显示

Uncaught ReferenceError: search is not defined
    at HTMLInputElement.onkeydown

当我尝试使用

时

 <script type="text/javascript">
    $('#myButton').click(function(){
            var value = $("input[type=text]").val();
                console.log(value+ " from the submit button");
                set_to_threshold(value);


            });


    </script>

当我按下提交按钮时没有发生任何变化（甚至没有在控制台中打印值）。但是为什么这个值没有打印出来。感谢任何帮助。

Answer 1

这就是你想要的。表单提交时的函数调用

<form id="distance_input" onSubmit="yourFunction(); return false;" >

Answer 2

    $('#myButton').click(function(){
      var value = $("input[type=text]").val();
            console.log(value);
      set_to_threshold(value);
      
    });

   function set_to_threshold(val){
     console.log('do something here with val ', val);
   }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <input type="text" value="input something"/>
  <button id="myButton">click</button>
</body>
</html>

Answer 3

请在您的文件中包含jquery。它工作正常。

<script
  src="https://code.jquery.com/jquery-2.2.4.min.js"
  integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
  crossorigin="anonymous"></script>

将此内容包含在html页面的head部分。还有你提到的函数set_to_threshold()是未定义的。所以只有你得到错误。请为它写一个函数。它会工作！

如何在表单提交时调用函数

3 个答案: