admin 管理员组

文章数量: 1086019

EDIT - SOLVED // As user Win pointed out in the answers, if a function is named click and you try to call it with a HTML button, then it will confuse the function with an inbuilt/standard "click()" function for HTML buttons

Can anybody figure out, why (in the world) this isn't working? I get no bug reports in Chrome, my IDE and/or JSFiddle.

HTML

<!DOCTYPE html>
<html>
<head>
  <script src="app.js"></script>
</head>
<body>
  <input id="search" type="text" name="input" placeholder="Search..">
  <button onclick="click()" value="Submit">Get weather</button>
</body>
</html>

JavaScript

function click() {
  if (document.getElementById("search").value == "New York") {
    console.log("Loading weather for New York..."); 
  } else {
    console.log("City name isn't valid. Try again");
  }
}

JSFiddle: /

Thanks in advance.

EDIT - SOLVED // As user Win pointed out in the answers, if a function is named click and you try to call it with a HTML button, then it will confuse the function with an inbuilt/standard "click()" function for HTML buttons

Can anybody figure out, why (in the world) this isn't working? I get no bug reports in Chrome, my IDE and/or JSFiddle.

HTML

<!DOCTYPE html>
<html>
<head>
  <script src="app.js"></script>
</head>
<body>
  <input id="search" type="text" name="input" placeholder="Search..">
  <button onclick="click()" value="Submit">Get weather</button>
</body>
</html>

JavaScript

function click() {
  if (document.getElementById("search").value == "New York") {
    console.log("Loading weather for New York..."); 
  } else {
    console.log("City name isn't valid. Try again");
  }
}

JSFiddle: https://jsfiddle/nd6f5pp7/

Thanks in advance.

  • javascript
  • html
  • function
  • button
  • input
Share Improve this question edited Jul 30, 2017 at 14:46 thesystem asked Jul 30, 2017 at 14:36 thesystemthesystem 6142 gold badges12 silver badges36 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 6

Don't call the function click, it'll get confused with obj prototypes.

// Grab Input from DOM
var iptSearch = document.getElementById('search')

// Grab Submit button from DOM
var btnGetWeather = document.getElementById('get-weather');

// Add Event Listener
btnGetWeather.addEventListener('click', function() {
  if (iptSearch.value === "New York") {
    console.log("Loading weather for New York...");
  } else {
    console.log("City name isn't valid. Try again");
  }
});
<input id="search" placeholder="Search..."/>
<button id="get-weather">Get Weather</button>

Or, if you want to follow the example code you've given. Use the below:

function getWeather() {
  if (document.getElementById('search').value === "New York") {
    console.log("Loading weather for New York...");
  } else {
    console.log("City name isn't valid. Try again");
  }
}
<!DOCTYPE html>
<html>

<head>
  <script src="app.js"></script>
</head>

<body>
  <input id="search" type="text" name="input" placeholder="Search..">
  <button onclick="getWeather()">Get weather</button>
</body>

</html>

本文标签： javascriptIfelse with button and inputStack Overflow

版权声明：本文标题：javascript - Ifelse with button and input - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://roclinux.cn/p/1744088099a2531516.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。