是否可以从文档中的输入字段执行简单的 javascript 语句

Is it possible to execute simple javascript statments from an input field in a document?

本文关键字：执行 字段 简单 javascript 语句 输入 是否 文档      更新时间：2023-09-26

在下面的示例中，我将一个函数main附加到输入字段。 该函数包含发送带有可变消息的警报的指令（无论用户输入到字段中的任何内容）。

<form>
<input type="text" onsubmit="main()" />
<input type="submit" />
</form>
<script>
function main (param) {
 alert(param)
}
//main();
</script>

它不起作用，但我相信那是因为我犯了一些我无法识别的菜鸟错误。此代码的功能版本的结果是能够提交"hello world"并生成一个警报框，说明"hello world"（不带引号）。

但是，除此之外，我希望能够将main("hello world");或仅alert('hello world');之类的内容传递给输入字段以产生相同的结果。

我认为我遇到的问题是每次提交时都会刷新页面。这里有一些类似的问题，人们建议使用onsubmit="main(); return false;"，但实际上这似乎不起作用。

看起来您想eval()输入的值。

慎用，有安全隐患...

从处理程序返回false会停止常规操作，因此在提交后没有重定向：

<form onsubmit="main(); return false;">
<input id="eval-input" type="text" />
<input type="submit" />
</form>
<script>
function main () {
 eval(document.getElementById('eval-input').value);
}
</script>

以下是检测表单提交的方法：

<form onsubmit="foo()">
    <input type="text">
    <input type="submit">
</form>
<script>
    function foo(){
        alert("function called");
    }
</script>

但是，如果您希望通过函数管理表单数据，我建议您这样做（首选项）：

<form id="myform">
    <input type="text">
    <input type="submit">
</form>
<script>
    document.getElementById("myform").onsubmit=function(event){
        alert("function called");
        //manage form submission here, such as AJAX and validation
        event.preventDefault(); //prevents a normal/double submission
        return false; //also prevents normal/double a double submission
    };
</script>

编辑：

使用 eval() 以 JavaScript 的形式执行字符串。

jQuery 方式：

您创建事件侦听器，当用户单击"提交"时将触发该侦听器。 

<form>
  <input type="text" id="text"/>
  <input type="submit" />
</form>
<script>
   $( "form" ).submit(function( event ) {
      event.preventDefault();
      alert( $('#text').val() );
   });
</script>

为了防止页面重新加载 - 您应该使用event.preventDefault();

纯JavaScript：

<form>
  <input type="text" id="text"/>
  <input type="submit" id="submit" />
</form>

<script>
  var button = document.getElementById("submit");
  var text = document.getElementById("text");
  button.addEventListener("click",function(e){
    alert(text.value);
  },false);
</script>

如果我明白你想做什么，你可以像这样调用函数，并编写参数[0].value，你可以访问输入值： 

    function main(params) {
       //dosomething;
      document.write(params[0].value);
        
    }
<form onsubmit="main(this)">
  <input type="text">
  <input type="submit">
</form>

试试这样的事情

   onchange="main()"

onmouseenter， onMouseOver， onmouseleave ...

   <input type="text" onmouseenter="main()" />
相关文章：