我正在尝试使用js将多个功能和按钮连接在一起。和html。我不确定我缺少什么

Question

When I open the Html file in the browser, it shows that the two are connected properly but it wont output anything I type into the box.I just need it to output the function result depending on which button was pressed. 当我在浏览器中打开Html文件时，表明两者已正确连接，但不会输出我在框中输入的任何内容，我只需要它根据按下哪个按钮来输出函数结果。 Any help or advice is appreciated. 任何帮助或建议，不胜感激。

 function reverseStr(s) { var o = []; for (var i = 0, len = s.length; i <= len; i++) o.push(s.charAt(len - i)); return o.join(''); } reverseStr("Hello"); var ch = "a"; var pattern =/a|e|i|o|u|y/i ; isVowelR(ch, pattern); function isVowelR(ch,pattern){ if(pattern.test(ch)){ return true; } else{return false} } function countVowles(str1) { var vowel_list = 'aeiouAEIOU'; var vcount = 0; for(var x = 0; x < str1.length ; x++) { if (vowel_list.indexOf(str1[x]) !== -1) { vcount += 1; } } return vcount; } console.log(countVowles("")); var pattern = /[0-9]/; function isDigit(regexp){ if(pattern.test(regexp)){ return true; } else{return false} } var main = function() { document.getElementByld("#inpt").value; //this keyword is set to the button that fired the event console.log(this.id); //dispatch on button id if (this.id == "btn1") document.querySelector("div").innerHTML = "You clicked Button1"; else if (this.id == "btn2") document.querySelector("div").innerHTML = "You clicked Button2"; else if (this.id == "btn3") document.querySelector("div").innerHTML = "You clicked Button3"; else document.querySelector("div").innerHTML = "You Clicked Button4"; }; //2. register the onclick handlers after the DOM is complete window.addEventListener("load", function() { //select the buttons var buttons = document.querySelectorAll("button"); //register the same handler for each button for (var i = 0; i < buttons.length; ++i) { buttons[i].addEventListener("click", main); } });

 <!DOCTYPE html> <html lang='en'> <head> <meta charset='utf-8' > <title> Buttons Demo </title> </head> <body> <h2>String Machine</h2> <p> Enter a String: </p> <input id= "inpt"> </input> <button id="btn1">Reverse</button> <button id="btn2">Vowel or no Vowel</button> <button id="btn3">Count Vowels</button> <button id="btn4">Digit or no Digit</button> <br> <hr style="width:23%; margin-left:0;"> <div id="outDiv"></div> <script src="stringMach.js"></script> </body> </html>

Answer 1

This is working fine. 一切正常。 Hope it'll helps 希望对你有帮助

 function reverseStr(s) { var o = []; for (var i = 0, len = s.length; i <= len; i++) o.push(s.charAt(len - i)); return o.join(''); } reverseStr("Hello"); var ch = "a"; var pattern =/a|e|i|o|u|y/i ; isVowelR(ch, pattern); function isVowelR(ch,pattern){ if(pattern.test(ch)){ return true; } else{ return false } } function countVowles(str1) { var vowel_list = 'aeiouAEIOU'; var vcount = 0; for(var x = 0; x < str1.length ; x++) { if (vowel_list.indexOf(str1[x]) !== -1) { vcount += 1; } } return vcount; } var pattern = /[0-9]/; function isDigit(regexp){ if(pattern.test(regexp)){ return true; } else{return false} } var main = function() { //this keyword is set to the button that fired the event var str = document.getElementById('inpt').value; var pattern =/a|e|i|o|u|y/i ; var pattern2 = /[0-9]/; console.log(this.id); //dispatch on button id if (this.id == "btn1") document.querySelector("div").innerHTML = reverseStr(str); else if (this.id == "btn2") document.querySelector("div").innerHTML = isVowelR(str, pattern); else if (this.id == "btn3") document.querySelector("div").innerHTML = countVowles(str); else document.querySelector("div").innerHTML = "You Clicked Button4"; }; //2. register the onclick handlers after the DOM is complete window.addEventListener("load", function() { //select the buttons var buttons = document.querySelectorAll("button"); //register the same handler for each button for (var i = 0; i < buttons.length; ++i) { buttons[i].addEventListener("click", main); } });

 <!DOCTYPE html> <html lang='en'> <head> <meta charset='utf-8' > <title> Buttons Demo </title> </head> <body> <h2>String Machine</h2> <p> Enter a String: </p> <input id= "inpt"> </input> <button id="btn1">Reverse</button> <button id="btn2">Vowel or no Vowel</button> <button id="btn3">Count Vowels</button> <button id="btn4">Digit or no Digit</button> <br> <hr style="width:23%; margin-left:0;"> <div id="outDiv"></div> <script src="stringMach.js"></script> </body> </html>

我正在尝试使用js将多个功能和按钮连接在一起。和html。我不确定我缺少什么

问题描述

1 个解决方案

解决方案1
0 已采纳 2017-05-09 03:12:36

我正在尝试使用js将多个功能和按钮连接在一起。 和html。 我不确定我缺少什么

问题描述

1 个解决方案

解决方案1 0 已采纳 2017-05-09 03:12:36

我正在尝试使用js将多个功能和按钮连接在一起。和html。我不确定我缺少什么

解决方案1
0 已采纳 2017-05-09 03:12:36