>source

동일한 부트 스트랩 모달을 트리거하는 2 개의 링크 (고객 추가 및 편집 양식)가 있습니다. 내 질문은 하나의 동일한 부트 스트랩 모달이 링크 추가 또는 링크 편집에서 어떻게 감지합니까?

내 현재 코드는

   <a href="" class="btn btn-default btn-rounded mb-4" data-toggle="modal" data-target="#modalCustomerForm">
        Add New Customer
    </a>
$('#modalCustomerForm').on('shown.bs.modal', function () {
    $(this).find('form')[0].reset();
})

  • 답변 # 1

    사용 relatedTarget 의 재산 event 모달 열기를 트리거 한 요소에 액세스하기위한 개체

    $('#exampleModal').on('shown.bs.modal', function(e){
       const buttonId = e.relatedTarget.id;
       $(this).find('.modal-body').text(`Button id = ${buttonId}`);      
    });
    
    

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" ></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" ></script>
    <!-- Button trigger modal -->
    <button id="btn_1" type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
      Modal Button 1
    </button>
    <button id="btn_2" type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
      Modal Button 2
    </button>
    <!-- Modal -->
    <div class="modal fade" id="exampleModal"  aria-hidden="true">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>
          <div class="modal-body"></div>     
        </div>
      </div>
    </div>
    
    

관련 자료

  • 이전 r - 미리 정의 된 비 균일 간격으로 주파수 히스토그램을 만드는 방법은 무엇입니까?
  • 다음 python - gensiminterfacesTransformedCorpus를 읽을 수있는 결과로 변환