Question

我的问题和例子基于杰森在this问题

中的回答

我试图避免使用eventListner，只是在单击提交按钮时调用handleClick onsubmit。

我的代码绝对没有任何反应。

为什么没有调用handleClick？

<html>
  <head>
    <script type="text/javascript">
      function getRadioButtonValue(rbutton)
      {
        for (var i = 0; i < rbutton.length; ++i)
        { 
          if (rbutton[i].checked)
            return rbutton[i].value;
        }
        return null;
      }

      function handleClick(event)
      {
        alert("Favorite weird creature: "+getRadioButtonValue(this["whichThing"]));
        event.preventDefault(); // disable normal form submit behavior
        return false; // prevent further bubbling of event
      }
    </script>
  </head>
<body>
    <form name="myform" onSubmit="JavaScript:handleClick()">
      <input name="Submit"  type="submit" value="Update" onClick="JavaScript:handleClick()"/>
      Which of the following do you like best?
      <p><input type="radio" name="whichThing" value="slithy toves" />Slithy toves</p>
      <p><input type="radio" name="whichThing" value="borogoves" />Borogoves</p>
      <p><input type="radio" name="whichThing" value="mome raths" />Mome raths</p>
    </form>
</body>
</html>

编辑：

请不要建议将框架作为解决方案。

以下是我对代码所做的相关更改，这会导致相同的行为。

      function handleClick()
      {
        alert("Favorite weird creature: "+getRadioButtonValue(document.myform['whichThing'])));
        event.preventDefault(); // disable normal form submit behavior
        return false; // prevent further bubbling of event
      }
    </script>
  </head>
<body>
<form name="aye">;
      <input name="Submit"  type="submit" value="Update" action="JavaScript:handleClick()"/>
      Which of the following do you like best?
      <p><input type="radio" name="whichThing" value="slithy toves" />Slithy toves</p>
      <p><input type="radio" name="whichThing" value="borogoves" />Borogoves</p>
      <p><input type="radio" name="whichThing" value="mome raths" />Mome raths</p>
    </form>

Answer 1

您可以使用带有

的javascript网址表单

<form action="javascript:handleClick()">

或使用onSubmit事件处理程序

<form onSubmit="return handleClick()">

在后面的表单中，如果从handleClick返回false，它将阻止正常的submision过程。如果您希望浏览器遵循正常的submision过程，则返回true。

由于Javascript:部分

，按钮中的onSubmit事件处理程序也会失败

修改我刚刚尝试了这段代码并且有效：

<html> <head> <script type="text/javascript"> function handleIt() { alert("hello"); } </script> </head> <body> <form name="myform" action="javascript:handleIt()"> <input name="Submit" type="submit" value="Update"/> </form> </body> </html>

Answer 2

在这段代码中：

getRadioButtonValue(this["whichThing"]))

你实际上并没有得到任何参考。因此，getradiobuttonvalue函数中的radiobutton未定义并引发错误。

修改要从单选按钮中获取值，请抓取JQuery库，然后使用：

$('input[name=whichThing]:checked').val()

编辑2 由于需要重新发明轮子，这里是非Jquery代码：

var t = ''; for (i=0; i<document.myform.whichThing.length; i++) { if (document.myform.whichThing[i].checked==true) { t = t + document.myform.whichThing[i].value; } }

或者，基本上，修改原始代码行以便阅读：

getRadioButtonValue(document.myform.whichThing))

编辑3 这是你的作业：

function handleClick() { alert("Favorite weird creature: " + getRadioButtonValue(document.aye.whichThing)); //event.preventDefault(); // disable normal form submit behavior return false; // prevent further bubbling of event } </script> </head> <body> <form name="aye" onSubmit="return handleClick()"> <input name="Submit" type="submit" value="Update" /> Which of the following do you like best? <p><input type="radio" name="whichThing" value="slithy toves" />Slithy toves</p> <p><input type="radio" name="whichThing" value="borogoves" />Borogoves</p> <p><input type="radio" name="whichThing" value="mome raths" />Mome raths</p> </form>

请注意以下内容，我已将函数调用移至Form的“onSubmit”事件。另一种方法是将SUBMIT按钮更改为标准按钮，并将其放入按钮的OnClick事件中。我还删除了函数名前面不需要的“JavaScript”，并在函数出来的值上添加了显式RETURN。

在函数本身中，我修改了表单的访问方式。结构是： 文件。[表格名称]。[控制名称] 以获取相关信息。由于您是从aye重命名的，因此必须更改document.myform。到document.aye。此外， document.aye [“whichThing”] 在此上下文中是错误的，因为它需要 document.aye.whichThing 。

最后一点，我注释掉了 event.preventDefault（）; 。该样本不需要该行。

编辑4 要清楚。 document.aye [“whichThing”] 将为您提供对所选值的直接访问权限，但 document.aye.whichThing 可让您访问当时的单选按钮集合需要检查。由于您使用“getRadioButtonValue（object）”函数来遍历集合，因此您需要使用 document.aye.whichThing 。

请参阅此方法的不同之处：

function handleClick() { alert("Direct Access: " + document.aye["whichThing"]); alert("Favorite weird creature: " + getRadioButtonValue(document.aye.whichThing)); return false; // prevent further bubbling of event }

Answer 3

Miquel（＃32）的漂亮例子应该重新填充：

<html>
 <head>
  <script type="text/javascript">
   function handleIt(txt) {   // txt == content of form input
    alert("Entered value: " + txt);
   }
  </script>
 </head>
 <body>
 <!-- javascript function in form action must have a parameter. This 
    parameter contains a value of named input -->
  <form name="myform" action="javascript:handleIt(lastname.value)">  
   <input type="text" name="lastname" id="lastname" maxlength="40"> 
   <input name="Submit"  type="submit" value="Update"/>
  </form>
 </body>
</html>

表格应该有：

<form name="myform" action="javascript:handleIt(lastname.value)">

Answer 4

您的编辑版本中有一些要更改的内容：

您已经采用了document.myform['whichThing']字面意思的建议。您的表单名为“aye”，因此访问whichThing单选按钮的代码应使用该名称：`document.aye ['whichThing']。
action标记没有<input>属性。请改为使用onclick：<input name="Submit" type="submit" value="Update" onclick="handleClick();return false"/>
在浏览器中获取和取消Event对象是一个非常复杂的过程。它根据浏览器类型和版本而有很大差异。 IE和Firefox以不同的方式处理这些事情，因此简单的event.preventDefault()将无法工作......事实上，事件变量可能甚至不会被定义，因为这是来自标签的onclick处理程序。这就是为什么上面的斯蒂芬努力建议一个框架。我意识到你想知道机制，我推荐谷歌。在这种情况下，作为一个简单的解决方法，在onclick标记中使用return false，如上面的数字2所示（或者从stephen建议的函数返回false）。
由于＃3，请删除处理程序中的所有内容而不是警告语句。

代码现在应该如下：

function handleClick()
      {
        alert("Favorite weird creature: "+getRadioButtonValue(document.aye['whichThing']));
      }
    </script>
  </head>
<body>
    <form name="aye">
      <input name="Submit"  type="submit" value="Update" onclick="handleClick();return false"/>
      Which of the following do you like best?
      <p><input type="radio" name="whichThing" value="slithy toves" />Slithy toves</p>
      <p><input type="radio" name="whichThing" value="borogoves" />Borogoves</p>
      <p><input type="radio" name="whichThing" value="mome raths" />Mome raths</p>
    </form>

Answer 5

从javascript:，onclick="..声明

中删除onsubmit="..

javascript:前缀仅用于href=""或类似属性（不是相关事件）

Answer 6

您的代码中的所有内容似乎都很完美，但handleClick（）无效的原因是，此函数在其函数调用中缺少参数（但是其中的函数定义包含一个参数，该参数使函数不匹配发生）

以下是用于计算所有学期总分数和相应成绩的示例工作代码。它演示了html文件中JavaScript函数（调用）的用法，还解决了您面临的问题。


model = SVC(probability=True)

#class_num = 150, data_train.shape = (3000, 500)
model.fit(data_train, label_train) 

start_time = time()
model.predict_proba(data_test[0].reshape(1, -1))
inference_time = (time() - start_time) # takes 0.002 seconds

start_time = time()
model.decision_function(data_test[0].reshape(1, -1))
inference_time = (time() - start_time) # takes 0.15 seconds

从html表单调用javascript

6 个答案: