如何在文本的基础上隐藏Div

时间:2017-08-17 11:45:37

标签: jquery

我希望获得文本的父级,就像文本的上部和下部一样 在更改隐藏和显示上传的选项之一:所有部分。

我尝试过indexOf(),Text()和一些函数。但我没有取得任何成功。我已经看过同一类和Id的所有部分。因此无法使用类或ID执行此操作,我需要仅使用选择选项更改的文本来执行此操作。

首先,我想隐藏下部,如果点击低于需要显示

<form method="post" action="abc.com/cart.php" onsubmit="return check_add_to_cart(this, false) "  enctype="multipart/form-data" id="productDetailsAddToCartForm">
                <input type="hidden" name="action" value="add" />
                <input type="hidden" name="product_id" value="123456" />
                <input type="hidden" name="variation_id" class="CartVariationId" value="" />
                <input type="hidden" name="currency_id" value="" />
                <div class="ProductDetailsGrid ProductAddToCart">
                   <div class="ProductOptionList">
                </div>
                <div class="productAttributeList" style="">
                   <div class="productAttributeRow productAttributeConfigurablePickListSet" id="1234567894582145454544545">
                   <div class="productAttributeLabel">
                    <label for="25rfdrdrdsrsde">
                   <span class="required">*</span>
                   <span class="name"> Choose a Color:</span>
                    </label>
                </div>
                <div class="productAttributeValue">
                <div class="productOptionViewSelect">
                <select class="validation" id="2c5c346518d3c0ed238b6f9f2b1791e2" name="attribute[01]">
                    <option value="" >-- Please Choose an Option --                 </option>
             <option value="01" selected="selected">Silver</option>
            <option value="02">maroon</option>
            <option value="03">skyblue</option>
            </select>
            </div>  </div>
                <div class="cf"></div>
            </div>
            <div class="productAttributeRow productAttributeConfigurablePickListSet" id="12345785541165645">
            <div class="productAttributeLabel">
            <label for="12354878454654546564">
            <span class="required">*</span>
            <span class="name"> Quality: </span>
            </label>
            </div>
            <div class="productAttributeValue">
            <div class="productOptionViewSelect">
            <select class="validation" id="7874545454611" name="attribute[02]">
            <option value="" > -- Please Choose an Option --                    </option>
            <option value="04" selected="selected">1</option>
            <option value="05" >2</option>
            </select>
            </div>  </div>
                <div class="cf"></div>
            </div>
            <div class="productAttributeRow productAttributeConfigurableEntryFile" id="1115781erwtewtetewterte14545">
                <div class="productAttributeLabel">
                    <label for="sdgdfgdfcxcbcvbxcbcdfsdfg">
                    <span class="required">*</span>
                    <span class="name"> upload upper: </span>
                    </label>
                </div>
                <div class="productAttributeValue">
                <div class="fileInput">
                <label><input type="file" id="sadfffsdfsfsf2344234234234234" class="validation" name="attribute[03]" /></label>
            </div>
            <div class="fileLimitations">
                            Maximum file size:40 MB </div>
            <div class="fileExisting">
            </div>
                </div>
                <div class="cf"></div>
            </div>
            <div class="productAttributeRow productAttributeConfigurablePickListSet" id="1215781erwtewtetewterte14545">
                <div class="productAttributeLabel">
                    <label for="1315781erwtewtetewterte14545">
                    <span class="required">*</span>
                    <span class="name"> full set:   </span>
                    </label>
                </div>
                <div class="productAttributeValue">
                <div class="productOptionViewSelect">
                <select class="validation" id="a1415781erwtewtetewterte14545" name="attribute[04]">
                    <option value="" >-- Please Choose an Option --                 </option>
            <option value="77" selected="selected">Upper</option>
            <option value="78">Lower</option>
            </select>
            </div>  </div>
                <div class="cf"></div>
            </div>
            <div class="productAttributeRow productAttributeConfigurablePickListSet" id="a1515781erwtewtetewterte14545">
                <div class="productAttributeLabel">
                <label for="1615781erwtewtetewterte14545">
                <span class="required">*</span>
                <span class="name">Shipment:</span>
                    </label>
                </div>
                <div class="productAttributeValue">
                <div class="productOptionViewSelect">
                <select class="validation" id="1715781erwtewtetewterte14545" name="attribute[05]">
                    <option value="" selected="selected">
                        -- Please Choose an Option --</option>
                    <option value="64" >Slow</option>
                    <option value="65" >fast</option>
                        </select>
            </div>  </div>
                <div class="cf"></div>
            </div>
            </div>
                </div>
            </form>

2 个答案:

答案 0 :(得分:0)

您可以尝试此解决方案:

&#13;
&#13;
$(document).ready(function(){
  $("span:contains('upload Lower')").parents(".productAttributeRow:eq(0)").hide();

  $(".productOptionViewSelect select").change(function(){    
      $("span:contains('upload Lower')").parents(".productAttributeRow:eq(0)").hide();
      $("span:contains('upload upper')").parents(".productAttributeRow:eq(0)").hide();
      var text= $.trim($(this).find("option:selected").text()).toLowerCase();
      if(text=="upper"){
        $("span:contains('upload upper')").parents(".productAttributeRow:eq(0)").show();
      }
      else if(text=="lower"){
        $("span:contains('upload Lower')").parents(".productAttributeRow:eq(0)").show();
      }    
  });
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method="post" action="abc.com/cart.php" onsubmit="return check_add_to_cart(this, false) "  enctype="multipart/form-data" id="productDetailsAddToCartForm">
                <input type="hidden" name="action" value="add" />
                <input type="hidden" name="product_id" value="123456" />
                <input type="hidden" name="variation_id" class="CartVariationId" value="" />
                <input type="hidden" name="currency_id" value="" />
                <div class="ProductDetailsGrid ProductAddToCart">
                   <div class="ProductOptionList">
                </div>
                <div class="productAttributeList" style="">
                   <div class="productAttributeRow productAttributeConfigurablePickListSet" id="1234567894582145454544545">
                   <div class="productAttributeLabel">
                    <label for="25rfdrdrdsrsde">
                   <span class="required">*</span>
                   <span class="name"> Choose a Color:</span>
                    </label>
                </div>
                <div class="productAttributeValue">
                <div class="productOptionViewSelect">
                <select class="validation" id="2c5c346518d3c0ed238b6f9f2b1791e2" name="attribute[01]">
                    <option value="" >-- Please Choose an Option --                 </option>
             <option value="01" selected="selected">Silver</option>
            <option value="02">maroon</option>
            <option value="03">skyblue</option>
            </select>
            </div>  </div>
                <div class="cf"></div>
            </div>
            <div class="productAttributeRow productAttributeConfigurablePickListSet" id="12345785541165645">
            <div class="productAttributeLabel">
            <label for="12354878454654546564">
            <span class="required">*</span>
            <span class="name"> Quality: </span>
            </label>
            </div>
            <div class="productAttributeValue">
            <div class="productOptionViewSelect">
            <select class="validation" id="7874545454611" name="attribute[02]">
            <option value="" > -- Please Choose an Option --                    </option>
            <option value="04" selected="selected">1</option>
            <option value="05" >2</option>
            </select>
            </div>  </div>
                <div class="cf"></div>
            </div>
            <div class="productAttributeRow productAttributeConfigurableEntryFile" id="1115781erwtewtetewterte14545">
                <div class="productAttributeLabel">
                    <label for="sdgdfgdfcxcbcvbxcbcdfsdfg">
                    <span class="required">*</span>
                    <span class="name"> upload upper: </span>
                    </label>
                </div>
                <div class="productAttributeValue">
                <div class="fileInput">
                <label><input type="file" id="sadfffsdfsfsf2344234234234234" class="validation" name="attribute[03]" /></label>
            </div>
            <div class="fileLimitations">
                            Maximum file size:40 MB </div>
            <div class="fileExisting">
            </div>
                </div>
                <div class="cf"></div>
            </div>
              <div class="productAttributeRow productAttributeConfigurableEntryFile" id="1115781erwtewtetewterte14545">
                <div class="productAttributeLabel">
                    <label for="sdgdfgdfcxcbcvbxcbcdfsdfg">
                    <span class="required">*</span>
                    <span class="name"> upload Lower: </span>
                    </label>
                </div>
                <div class="productAttributeValue">
                <div class="fileInput">
                <label><input type="file" id="sadfffsdfsfsf2344234234234234" class="validation" name="attribute[03]" /></label>
            </div>
            <div class="fileLimitations">
                            Maximum file size:40 MB </div>
            <div class="fileExisting">
            </div>
                </div>
                <div class="cf"></div>
            </div>
            <div class="productAttributeRow productAttributeConfigurablePickListSet" id="1215781erwtewtetewterte14545">
                <div class="productAttributeLabel">
                    <label for="1315781erwtewtetewterte14545">
                    <span class="required">*</span>
                    <span class="name"> full set:   </span>
                    </label>
                </div>
                <div class="productAttributeValue">
                <div class="productOptionViewSelect">
                <select class="validation" id="a1415781erwtewtetewterte14545" name="attribute[04]">
                    <option value="" >-- Please Choose an Option --                 </option>
            <option value="77" selected="selected">Upper</option>
            <option value="78">Lower</option>
            </select>
            </div>  </div>
                <div class="cf"></div>
            </div>
            <div class="productAttributeRow productAttributeConfigurablePickListSet" id="a1515781erwtewtetewterte14545">
                <div class="productAttributeLabel">
                <label for="1615781erwtewtetewterte14545">
                <span class="required">*</span>
                <span class="name">Shipment:</span>
                    </label>
                </div>
                <div class="productAttributeValue">
                <div class="productOptionViewSelect">
                <select class="validation" id="1715781erwtewtetewterte14545" name="attribute[05]">
                    <option value="" selected="selected">
                        -- Please Choose an Option --</option>
                    <option value="64" >Slow</option>
                    <option value="65" >fast</option>
                        </select>
            </div>  </div>
                <div class="cf"></div>
            </div>
            </div>
                </div>
            </form>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

 find("option:contains('Lower')").parent()