使用jquery在click事件中查找表单

时间:2018-02-01 23:06:00

标签: javascript jquery html



$(function() {
$('.offer-wrapper').click(function (e) {
        if ($(e.target).hasClass('form')) {
            return // do something here if there is a form
        }
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<div class="offer-wrapper">

  <div class="offer-image-wrapper offer-col1">
    test
  </div>

  <div class="offer-text offer-col2">
    <ul>
      <li>test</li>
      <li>test</li>
    </ul>
  </div>

  <div class="offer-button offer-col3">
    <a href="test">test </a>
  </div>

  <div class="modal fade" id="ascent-form-modal" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-body">
          <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
          <form>
            <input placeholder="test" type="text">
          </form>
          <div class="clear"></div>
        </div>
      </div>
    </div>
  </div>

</div>
&#13;
&#13;
&#13;

我的目标是找出我点击的容器是否有表格。我的问题是我不知道如何制作通用的遍历方法来完成点击容器上的任何地方并搜索表单。

1 个答案:

答案 0 :(得分:2)

您可以使用find()搜索所点击元素的子元素:

$('.offer-wrapper').on('click',function () {
        if ($(this).find('form').length > 0 ) {
            console.log('here');
        }
    });

这是一个小提琴演示:https://jsfiddle.net/zephyr_hex/6xf2z9xq/2/