代码之家 › 专栏 › 技术社区 › phurst-so

在传递带参数的函数时单击不触发的事件

addeventlistener javascript

phurst-so · 技术社区 · 6 年前

有人能告诉我为什么这个点击事件不会触发吗?这个 function

function longestWordFunc(stringArg) {
  console.log(stringArg)
  var stringSplit = stringArg.split(" ");
  console.log(stringSplit)
  var longestWord = 0;
  
  for(var i = 0; i < stringSplit.length; i++){
    if(stringSplit[i].length > longestWord){

      longestWord = stringSplit[i].length;   
    }
    longestWord = stringSplit[i];
   };
  console.log(longestWord)
  console.log(longestWord.length)
  document.getElementsByClassName("longestWord").innerHTML = longestWord;
  document.getElementsByClassName("longestWordCount").innerHTML = longestWord.length;
};

let searchString = document.querySelector(".searchString").value;
console.log(searchString);
document.querySelector(".generate").addEventListener("click", longestWordFunc(searchString));

<input type="text" name="searchString" class="searchString">

<span class="longestWord"></span>
<span class="longestWordCount"></span>

<button class="generate">Generate</button>

先谢谢你。

2 回复 | 直到 4 年前

pretzelhammer Paras Bhattrai 6 年前

longestWordFunc(searchString) undefined ,所以这行:

document.querySelector(".generate").addEventListener("click", longestWordFunc(searchString));

document.querySelector(".generate").addEventListener("click", undefined);

我已将您的代码片段修复为在下面工作:

function longestWordFunc() {
  let stringArg = document.querySelector(".searchString").value;
  console.log(stringArg);
  var stringSplit = stringArg.split(" ");
  console.log(stringSplit);
  var longestWord = 0;
  
  for(var i = 0; i < stringSplit.length; i++){
    if(stringSplit[i].length > longestWord){

      longestWord = stringSplit[i].length;   
    }
    longestWord = stringSplit[i];
   };
  console.log(longestWord);
  console.log(longestWord.length);
  document.getElementsByClassName("longestWord").innerHTML = longestWord;
  document.getElementsByClassName("longestWordCount").innerHTML = longestWord.length;
};

document.querySelector(".generate").addEventListener("click", longestWordFunc);

<input type="text" name="searchString" class="searchString">

<span class="longestWord"></span>
<span class="longestWordCount"></span>

<button class="generate">Generate</button>

vrintle Jake 6 年前

你应该定义 searchString 在的事件侦听器中 .generate . 除非,你的 搜索字符串 会是 undefined

function longestWordFunc(stringArg) {
  console.log(stringArg)
  var stringSplit = stringArg.split(" ");
  console.log(stringSplit)
  var longestWord = 0;
  
  for(var i = 0; i < stringSplit.length; i++){
    if(stringSplit[i].length > longestWord){

      longestWord = stringSplit[i].length;   
    }
    longestWord = stringSplit[i];
   };
  console.log(longestWord)
  console.log(longestWord.length)
  document.getElementsByClassName("longestWord").innerHTML = longestWord;
  document.getElementsByClassName("longestWordCount").innerHTML = longestWord.length;
};
document.querySelector(".generate").addEventListener("click", () => {
  let searchString = document.querySelector(".searchString").value;
  longestWordFunc(searchString);
});

<input type="text" name="searchString" class="searchString">

<span class="longestWord"></span>
<span class="longestWordCount"></span>

<button class="generate">Generate</button>