基于javascript函数的手风琴隐藏/显示

我有一个手风琴和一个面板，我只想显示，如果某些标准得到满足。面板id为“产品选项”

我有两个javascript函数，一个是从下拉列表（dropdown id=“province”）验证状态，另一个是通过复选框（checkbox id=“age\u verification”）验证年龄。手风琴面板“产品选项”通过标题id=“BuyThis”激活

我只想在状态与列表匹配时显示面板“产品选项”

以下是我的原稿：

<script>
// Validates State is in list of allowed for wine shipping...  
function validateState() {
      // Confirms province is allowed for wine shipping     
          var states = ["Alaska", "Arizona", "California", "Colorado", ""];
                 if ($.inArray($("#province").val(), states) <0) {
                 alert("Shipping gifts containing alcohol to this state is prohibited by law. Please choose another item.");
                 return false;       
        }
alert("Item Available! Please choose your options.");
return true;
}
    // Validates age verification is checked...   
    function validateAge() {    
        if (!$('#age_verification').is(':checked')) {
            alert("Please verify you are 21 years of age or older.");
            return false;       
        }    
return true;
}
</script>

//验证状态在允许葡萄酒运输的列表中。。。
函数validateState（）{
//确认该省允许葡萄酒运输
var states=[“阿拉斯加”、“亚利桑那州”、“加利福尼亚州”、“科罗拉多州”和“]；
如果（$.inArray（$（“#province”）.val（），states）请这样尝试：

<h3 id="BuyThis" ><button class="Button buyThisBtn"><i class="icon-shopping-cart"></i>&nbsp;&nbsp;Buy This!</button></h3>              
<div class="ProductContainer" id="product-options"> 
    <form>
    [BODY OF ACCORDION PANEL WITH A BUNCH OF IRRELEVANT CODE......]     

             <button id="addtocart" type="submit" class="Button" onclick="validateAge(); return validateState();"><i class="icon-shopping-cart"></i> ADD TO CART</button>                   
    </form>
</div>


$(function () {
    $("#buyThis").click(function () {

if(validateState()){

       if ($.inArray($("#province").val(), states) <0) {                
         alert("Shipping gifts containing alcohol to this state is prohibited by law.         Please choose another item.");
         $("product-options").hide();               
       }                
    $("product-options").show();
  }             
}

ValidateEstate函数完成了吗？它没有返回true；对于其他情况。@veritasetratio~对不起，我有返回true，只是不小心遗漏了它。我编辑了这篇文章，但遗漏了几行。谢谢！~你好，谢谢你的文章！非常感谢你的帮助，但这不起作用。还有其他想法吗？Thanks@Sandcar-要提到的是，$（“产品选项”）.hide（）和$（“产品选项”）.show（）行中缺少id的“#”。然而，即使在添加了这个之后，仍然不起作用。@susan:我将发布一个编辑消息。请查看评论和提供的小提琴。非常感谢。我不知道为什么或者如何，但是你的方式对我一点都不起作用。没有任何警报弹出，手风琴也没有响应。不过，我确实认为这是错误的。可能是因为它是一个jQuery手风琴，还有其他事件在起作用。我做了一个提琴，但是，它只适合查看代码，因为jQuery手风琴插件是功能所必需的。我确信你是对的，我做错了，但它正在工作……这是提琴：~也是出于某种原因，当我更改$inArray时方法到语法，它只对数组中的第一个元素（在这种情况下为“阿拉巴马”）作出反应，它不考虑其他元素。
$(function () {
    $("#buyThis").change(function () {
    if ($.inArray($("#province").val(), states) <0) {                
         alert("Shipping gifts containing alcohol to this state is prohibited by law. Please choose another item.");
         $("product-options").hide();               
    }                
$("product-options").show();             
}

<h3 id="BuyThis" ><button class="Button buyThisBtn"><i class="icon-shopping-cart"></i>&nbsp;&nbsp;Buy This!</button></h3>              
<div class="ProductContainer" id="product-options"> 
    <form>
    [BODY OF ACCORDION PANEL WITH A BUNCH OF IRRELEVANT CODE......]     

             <button id="addtocart" type="submit" class="Button" onclick="validateAge(); return validateState();"><i class="icon-shopping-cart"></i> ADD TO CART</button>                   
    </form>
</div>


$(function () {
    $("#buyThis").click(function () {

if(validateState()){

       if ($.inArray($("#province").val(), states) <0) {                
         alert("Shipping gifts containing alcohol to this state is prohibited by law.         Please choose another item.");
         $("product-options").hide();               
       }                
    $("product-options").show();
  }             
}

<select id="province">
    <option value="Alabama">Alabama</option>
    <option value="Alaska">Alaska</option>
    <option value="Arizona">Arizona</option>
    <option value="Arkansas">Arkansas</option>
    <option value="California">Colorado</option>
</select>
         <button id="test" >Teste</button>  
<h3 id="BuyThis" style="background:red;" >

    <button id="buyThisButton" class="Button buyThisBtn"><i class="icon-shopping-cart"></i>&nbsp;&nbsp;Buy This!</button>
</h3>              
<div class="ProductContainer" id="product-options"> 
    <form>
    [BODY OF ACCORDION PANEL WITH A BUNCH OF IRRELEVANT CODE......]    
        <button id="addtocart" type="submit" class="Button" onclick="validateAge(); return validateState();"><i class="icon-shopping-cart"></i> ADD TO CART</button>                   
    </form>
</div>

$( document ).ready(function() {
  // Handler for .ready() called.

    $("#BuyThis").click(function() {
    //alert("test");

     if(validateState()){
         // if state is valid do this

     }else{
     // do that

     }
  });


}); // end of dom ready



// Validates State is in list of allowed for wine shipping...  
function validateState() {
      // Confirms province is allowed for wine shipping     
          var states = ["Alaska", "Arizona"];
                 if ($.inArray($("#province").val(), states) >= 0) {                     
                 alert("Oh no! Shipping items containing alcohol to this state is prohibited by law. Please choose another item.");
                 //$("#BuyThis").unbind("click");
                 $("#product-options").slideUp(); 
                 return false;       
        }
    alert("Item Available! Please choose your options.");
    $("#product-options").slideDown();  
    return true;
}


    // Validates age verification is checked...   
    function validateAge() {    
        if (!$('#age_verification').is(':checked')) {
            alert("Please verify you are 21 years of age or older.");
            return false;       
        }    
return true;
}