Question

我有两个文本框input[type=text] elements，我想要做的就是它们有一个值＆＃34;不是空白＆＃34;我想显示一个div，一旦它们中的任何一个都有一个空白值来隐藏div。

我做错了什么？

＆＃13;

$(document).ready(function() {
  var AppName = $(".appname").val(),
      AppUrl = $(".appurl").val();

  $("input").on("keyup change", function() {
    if ((AppName === "") && (AppUrl === "")) {
      $("div").addClass("hide");
    } else {
      $("div").removeClass("hide");
    }
  });
});

＆＃13;

.hide {
  display: none;
}

＆＃13;

<!DOCTYPE html>
<html>
  <head>
    <title>Check Fields</title>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=9" />
    <link type="text/css" rel="stylesheet" href="http://necolas.github.io/normalize.css/3.0.1/normalize.css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
  </head>
  <body>
    <input class="appname" type="text" placeholder="Application name"> 
    <input class="appurl" type="text" placeholder="http://website.com/">
    <div class="hide">All fields are filled :)</div>
  </body>
</html>

＆＃13;

Answer 1

您应该使用move语句在click处理程序中获取值。

$("input").on("keyup change", function() {
  var AppName = $(".appname").val(),
      AppUrl = $(".appurl").val();

    if ((AppName === "") && (AppUrl === "")) {
      $("div").addClass("hide");
    } else {
      $("div").removeClass("hide");
    }
});

您也可以使用.toggleClass(state)

一个布尔值，用于确定是应该添加还是删除该类。

$("input").on("keyup change", function() {
    $("div").toggleClass("hide", $(".appname").val() === "" && $(".appurl").val() === "");
});

如果两个文本框的值不是空白执行功能

1 个答案: