Question

我在这里缺少打印'user_input'以显示段落？

是否需要myform.submit？因为实际上我可以访问该变量并使用它发出警报..

<script language="JavaScript">
    function getData(input) {
        var input = document.getElementById("user_input").value;
        // alert(input)
        document.myform.submit()
        $('.display').text("The URL is : " + input)
        }
  </script>

  <script
  src="https://code.jquery.com/jquery-3.2.1.slim.js"
  integrity="sha256-tA8y0XqiwnpwmOIl3SGAcFl2RvxHjA8qp0+1uCGmRmg="
  crossorigin="anonymous"></script>

<form id="myform">
<label><b>Enter a URL</b></label>
<input type="text" name="message" id="user_input">
<input type="submit" id="submit" onclick="getData()"><br/>
<p id="display"><span></span></p>
</form>

Answer 1

不要将java-script / jQuery混合到彼此中。

由于您使用的是jQuery库，因此请以更好的方式执行此操作： -

工作示例： -

＆＃13;

$(document).ready(function(){ // when document is rendered completely
  $('#submit').click(function(e){ // on click of submit button
    e.preventDefault(); // prevent the form submit
    var input =$("#user_input").val(); // get input value
    $('#display').text("The URL is : " + input); // add it as a text to paragraph
  });
});

＆＃13;

<script src="https://code.jquery.com/jquery-3.2.1.slim.js" integrity="sha256-tA8y0XqiwnpwmOIl3SGAcFl2RvxHjA8qp0+1uCGmRmg=" crossorigin="anonymous"></script>

<form id="myform">
  <label><b>Enter a URL</b></label>
  <input type="text" name="message" id="user_input">
  <input type="submit" id="submit"><br/><!-- no need of onclick-->
  <p id="display"><span></span></p>
</form>

＆＃13;

Answer 2

您必须执行响应实际要求您执行的操作，只需将method属性添加到表单元素：<form method="POST">

<强> Working DEMO

使用JS发送表单时请使用POST resquest

2 个答案: