4

我使用此脚本在静态页面中搜索

但是我希望在我输入文本输入而不是当我单击按钮时进行搜索,我搜索并发现其中任何一个都可以:

onkeypress="this.submit();"
onkeyup="this.submit();"
onkeypress="document.forms["f1"].submit();"
onkeyup="document.forms["f1"].submit();"

但它们都不起作用

我在脚本中使用了相同的 html

<form id="f1" name="f1" action="javascript:void()" onsubmit="if(this.t1.value!=null &amp;&amp; this.t1.value!='')parent.findString(this.t1.value);return false;">
<input type="text" id="t1" name="t1" value="Search" onfocus="if(this.value=='Search')this.value='';" size="20" onkeypress="this.submit();" />
<input type="submit" name="b1" value="Find" />
</form>
4

4 回答 4

3

form.submit() 不会触发 onsubmit。您应该改为实现一个函数。

您的 onkeyup 脚本是违反直觉的,因为选择文本 onkeyup 需要模糊文本框焦点。

findString(this.value);使用调用而不是提交的代码段创建了一个测试:

http://jsfiddle.net/e9Esz/

some sample text
<form id="f1" name="f1" action="javascript:void(0)" onsubmit="if(this.t1.value!=null &amp;&amp; this.t1.value!='')parent.findString(this.t1.value);return false;">
<input type="text" id="t1" name="t1" value="Search" onfocus="if(this.value=='Search')this.value='';" size="20" onkeyup="findString(this.value);" />
<input type="submit" id="b1" name="b1" value="Find" />
</form>

Javascript:

var TRange=null;

function findString (str) {
 if (parseInt(navigator.appVersion)<4) return;
 var strFound;
 if (window.find) {

  // CODE FOR BROWSERS THAT SUPPORT window.find

  strFound=self.find(str);
  if (!strFound) {
   strFound=self.find(str,0,1);
   while (self.find(str,0,1)) continue;
  }
 }
 else if (navigator.appName.indexOf("Microsoft")!=-1) {

  // EXPLORER-SPECIFIC CODE

  if (TRange!=null) {
   TRange.collapse(false);
   strFound=TRange.findText(str);
   if (strFound) TRange.select();
  }
  if (TRange==null || strFound==0) {
   TRange=self.document.body.createTextRange();
   strFound=TRange.findText(str);
   if (strFound) TRange.select();
  }
 }
 else if (navigator.appName=="Opera") {
  alert ("Opera browsers not supported, sorry...")
  return;
 }
 if (!strFound) alert ("String '"+str+"' not found!")
 return;
}
于 2013-06-18T18:09:10.507 回答
1

你有报价问题!这里的颜色编码显示了它!

onkeypress="document.forms["f1"].submit();"
           ^                ^
         opens           closes

sumbit 在表格上,而不是在元素上,因此为什么会this.submit失败。

你需要

this.form.submit()
于 2013-06-18T13:27:34.730 回答
1

正如汤姆所说,调用form.submit()不会触发 onsubmit 处理程序。只有在手动提交表单时才会调用 onsubmit 处理程序。因此,如果您尝试手动提交表单,则必须自行检查错误。

HTML

<form id="f1">...<form/>

JS

// After the DOM is loaded
var form = document.getElementById('f1');
function canSubmit(form) {
    if(form.t1.value!=null && form.t1.value!='') {

    }
    return false;
}

form.onsubmit = function() {
    return canSubmit(form);
}

form.onkeypress = function() {
    if(canSubmit(form)){
        form.submit();
    }
}

说了这么多,如果你只是有一个findString更聪明一点的,那么你会从两个地方调用它并在空时忽略它

function findString(value) {
    if (value) {
        parent.findString(form.t1.value);
    }
}

form.onsubmit = function() {
    findString(form.t1.value);
    return false;
}

form.onkeypress = function() {
    findString(form.t1.value);
}
于 2013-06-18T18:51:15.170 回答
0

也许您应该使用addEventListener()来分配事件。此外,你有一个错字。最好使用单引号作为字符串的开始/结束,这样内联双引号就没有问题(反之亦然)。

onkeypress='document.forms["f1"].submit();'

并通过 Javascript 提交表单:

document.forms[0].submit()

提交第一个表单。

于 2013-06-18T13:30:32.577 回答