不选择正确使用jQuery显示隐藏的div容器元素

Question

更新

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $("#the_submit_button").click(function(){ 
     e.preventDefault(); 
     if $("representativepassword") == "sales" 
      $("protectivepanel").hide() 
      $("secretpanel").show() 
    }); 
    }); 
</script> 

我收到未捕获的语法错误，意想不到的标识

---

这里是我的嵌入的JavaScript

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $("#the_submit_button").click(function(){ 
     e.preventDefault(); 
     if $("text") == "sales" <!--something here--> 
      $("protectivepanel").hide() 
      $("secretpanel").show() 
    }); 
    }); 
</script> 

我从未使用过jquery。我知道这是正确选择the_submit_button因为我已经尝试修改它将CSS。

这是我的引导形式

<div class="container" id="protectivepanel"> 
    <form role="form"> 
    <div class="form-group"> 
     <label for="representativepassword">Representative's Password</label> 
     <input type="text" class="form-control" id="representativepassword" placeholder=" Enter Password"> 
     <button type="submit" class="btn btn-default" id="the_submit_button">Submit</button> 
    </form> 
<div> 

我有我隐藏，一旦密码输入正确揭示出了巨大的容器。

目前容器看起来像这样

秘密的东西

我已经试过

("input:sales"), ("representativepassword"), ("representativepassword) 

语法错误？没有正确选择ID？

Answer 1

你的选择没有指定ID .. $("#representativepassword") ..

使用＃通过ID选择..

这里可以选择的列表：

http://api.jquery.com/category/selectors/

Answer 2

jQuery使用CSS选择器：

$('div') 

名争夺所有div

$("#protectivepanel") 

争夺元素与protectivepanel为ID在

类

Answer 3

与secretpanel

$(".secretpanel").show() 

争夺元素你有一对夫妇的问题在这里。

1. 您在e.preventDefault()中引用了未定义的变量e。尝试将参数e添加到处理click事件的匿名函数声明中。例如：$("#the_submit_button").click(function(e){。
2. 您正在传递id值给jQuery，但省略了“＃”前缀，它告诉jQuery它们应该是ID。例如，您需要将$("protectivepanel")更改为$("3protectivepanel")。
3. 您试图通过将“text”传递给jQuery来选择文本输入元素，但您应该这样做：$("input[type=text]")。
4. 一旦您选择了文本输入元素，您需要使用val()方法来获取其内容。因此请将if $("text") == "sales"更改为if $("input[type=text]").val() === "sales"。

Answer 4

正如其他人所说，你需要为元素指定选择器，如果它是一个ID，一个类或类型与这样的元素。

$(document).ready(function(){ 
    $("#the_submit_button").click(function(e){ //you need to send the event to the function otherwise the submit will work as normal 
     e.preventDefault(); 
     if($(":text") == "sales"){ //Search for an element of type text 
      $("#protectivepanel").hide() //missing # for id 
      $("#secretpanel").show() //missing # for id or . for class 
     } 
    }); 
    });