javascript - 无法在 HTML 中运行 javascript onClick?

标签 javascript html css

我正在尝试发送通过文本框收到的用户输入,然后将该输入发送到 javascript,这是另一个文件 (myfile.js)。由于某种原因,html 部分无法正常工作。这是代码: 我的文件.js:

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;
}

搜索.html

<!DOCTYPE html>
<HTML>
<HEAD>
</head>
<title>Search</title>
<body>
<script src="myfile.js" type="text/javascript"></script>
<form name="input">

Search for: <input type="text" id ="keytex" name="keytext" onClick='if(document.getElementById("keytex").value!=\'\') findString(document.getElementById("keytex").value); return(false);'>
</form>
<p> You can search this text. Search the text again</p>
</body>
</html>

最佳答案

嗯...您甚至检查过您的 HTML 了吗? (您的代码中有许多错误,这里是一个错误。)

<input onClick='if(document.getElementById("keytex").value!=\'\') findString(document.getElementById("keytex").value); return(false);'>

看到那些\'了吗?你不能在 HTML 中这样做。另外,在内联代码中使用括号 if(){}

这应该有效:

if(document.getElementById("keytex").value!="")

PS:不要使用内联 JavaScript。他们只会在最后给你一个更困惑的 HTML。

//Good
document.querySelector("#keytex").addEventListener("click",function(){
    if(this.value!=""){             //Use "this" to refer back the element.
        findString(this.value);
    }
    return false;
});

了解更多:

关于javascript - 无法在 HTML 中运行 javascript onClick?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11571443/

相关文章:

javascript - 在 PHP 中获取 HTML 页面的 OnLoad HTML/DOM

javascript - 使用 {% url %} 进行 NoReverseMatch

html - 在 flex box 中使用时,网格不占据其 div 的全部高度

html - 高度似乎无法在 Chrome 77 上正常工作

javascript - 使用 jQuery 在 ajax 调用中仅发送数组中对象的少数属性

javascript - 为什么这个函数会触发多次?

html - Zurb 基金会 flex 网格问题

jquery - onClick 仅适用于表格中的第一个按钮

javascript - 动态添加单选按钮

javascript - 无法从node.js更新mongodb中的文档