Question

点击inDeleteInnerSub类时我有这个HTML，我需要删除它的Order Now按钮

我试过这种方式，但它不起作用。

<div id="restmenu" class="restMenu">
   <ul>
      <section id="3" addlabel="Office" class="ulseWrap lielement">
         <div class="intit someclassss  ">Office<span id="deleteOffice" class="inDelete"></span><span class="inEdit" title="Modify Address" name="Modify Address"></span></div>
         <ul class="restListings">
            <div class="inner-intit">
               <sub class="sub">Yours Favorite Restaurant</sub><br>
               <li class="innerChild" user_location="Office" vendor_avialab_id="1" vendor_name="VC4 Raj" vendor_id="9">
                  <h6> VC4 Raj</h6>
                  <p>Building No.1,  , Software units layout , Softsol , Mindspace , Madhapur , Hyderabad </p>
                  <p>9192939495</p>
                  <p><b>Timings:</b> 10:00 AM - 09:00 PM</p>
                  <span class="inDeleteInnerSub"></span>
               </li>
               <input type="button" name="btn1" class="ordernow btn btn-success" value="Order Now" style="float:right"><input type="button" area="Office" location="Office" name="btn1" class="btn btn-success buttonsearchRestaurant pull-left" value="Add Restaurant ForOffice">
            </div>
         </ul>
      </section>
   </ul>
</div>


  $(document).on('click', '.inDeleteInnerSub', function(event ) {



                $(this).closest('.ordernow').remove();

});

任何人都可以帮助我

Answer 1

尝试

$(document).on('click', '.inDeleteInnerSub', function(event) {
  $(this).parent().next('.ordernow').remove();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="restmenu" class="restMenu">
  <ul>
    <section id="3" addlabel="Office" class="ulseWrap lielement">
      <div class="intit someclassss  ">Office<span id="deleteOffice" class="inDelete"></span><span class="inEdit" title="Modify Address" name="Modify Address"></span>
      </div>
      <ul class="restListings">
        <div class="inner-intit">
          <sub class="sub">Yours Favorite Restaurant</sub>
          <br/>
          <li class="innerChild" user_location="Office" vendor_avialab_id="1" vendor_name="VC4 Raj" vendor_id="9">
            <h6> VC4 Raj</h6>
            <p>Building No.1, , Software units layout , Softsol , Mindspace , Madhapur , Hyderabad</p>
            <p>9192939495</p>
            <p><b>Timings:</b> 10:00 AM - 09:00 PM</p>
            <span class="inDeleteInnerSub">-----</span>
          </li>
          <input type="button" name="btn1" class="ordernow btn btn-success" value="Order Now" style="float:right" />
          <input type="button" area="Office" location="Office" name="btn1" class="btn btn-success buttonsearchRestaurant pull-left" value="Add Restaurant ForOffice" />
        </div>
      </ul>
    </section>
  </ul>
</div>

Answer 2

试试这个：您可以使用div获取其父class="inner-intit"，并在父div内找到包含class="ordernow"的输入按钮

$(document).on('click', '.inDeleteInnerSub', function(event ) {
    $(this).closest('.inner-intit').find('.ordernow').remove();
});

注意 - 在inDeleteInnerSub范围内，您内部没有任何内容，点击此span会在其中放入一些文字，如下所示

<span class="inDeleteInnerSub">Click here</span>

<强> Demo

如何删除该部分中的按钮？

2 个答案: