0

我在此找到的所有内容都需要 jquery,但我想要一种方法,以便我可以在文本框和滑块中输入内容然后提交(最好不更改页面)并让表单数据修改 java 脚本变量而无需使用 jquery

4

2 回答 2

0

您需要一个函数,该函数将使用用户在表单中提供的值来根据需要更新 JS 变量。然后你只需要从按钮的onclick处理程序中调用这个函数:

<script>
    var myVarToUpdate = "test";

    function update() {
        // find the input element by ID and assign its value to `myVarToUpdate`
        myVarToUpdate = document.getElementById("someText").value;
    }
</script>

<form>
    <input id="someText" value="" />
    <button type="button" onclick="update()">Update</button>
</form>

这种方式根本不会提交表单,即页面不会重新加载。<form>实际上,在这种情况下,您甚至不需要适当的。

于 2013-07-07T04:38:01.763 回答
0

除非您特别需要提交功能,否则您可以执行以下操作

通过数据属性使您的 HTML 输入元素命名为 jsvar,如下所示:

  <input data-jsvar="myvar" />

在您的 JS 中,将onChange处理程序放在这些输入元素上:

  function changeVar (ev) {
    var v = this.getAttribute ('data-jsvar');
    if (v && v in window) {
      window[v] = this.value;
      console.log (v + ' = ' + window[v]);  // for debug
    }
  }


  [].forEach.call (document.querySelectorAll ('[data-jsvar]'), function (inp) {
      inp.addEventListener ('change', changeVar, false);
      window[inp.getAttribute ('data-jsvar')] = inp.value; // optional init for var
  });

这巧妙地将 JS 与 HTML 分开,只需添加 html 元素即可轻松扩展。请参阅http://jsfiddle.net/jstoolsmith/zvhpc/上的演示

于 2013-07-07T06:55:33.970 回答