이 글은 주로 부트스트랩의 확인 메시지를 사용자 정의하는 효과에 대해 자세히 소개합니다. 관심 있는 친구들이 참고할 수 있기를 바랍니다.
Effect
여기에 사진 설명 쓰기
js side
var Common = { confirm:function(params){ var model = $("#common_confirm_model"); model.find(".title").html(params.title) model.find(".message").html(params.message) $("#common_confirm_btn").click() //每次都将监听先关闭,防止多次监听发生,确保只有一次监听 model.find(".cancel").die("click") model.find(".ok").die("click") model.find(".ok").live("click",function(){ params.operate(true) }) model.find(".cancel").live("click",function(){ params.operate(false) }) } }
html side
<input type="hidden" id="common_confirm_btn" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#common_confirm_model"> <p id="common_confirm_model" class="modal"> <p class="modal-dialog modal-sm"> <p class="modal-content"> <p class="modal-header"> <button type="button" class="close" data-dismiss="modal"> <span aria-hidden="true">×</span> <span class="sr-only">Close</span></button> <h5 class="modal-title"><i class="fa fa-exclamation-circle"></i> <span class="title"></span> </h5> </p> <p class="modal-body small"> <p ><span class="message"></span></p> </p> <p class="modal-footer" > <button type="button" class="btn btn-primary ok" data-dismiss="modal">确认</button> <button type="button" class="btn btn-default cancel" data-dismiss="modal">取消</button> </p> </p> </p> </p>
Call
Common.confirm({ title: "标题", message: "内容", operate: function (reselt) { if (reselt) { ........ } else { ........ } } })
관련 추천:
Jquery 양식 검증 토스트 프롬프트 효과 예시 공유
jquery php Baidu 검색 상자 스마트 프롬프트 효과_PHP 튜토리얼
위 내용은 Bootstrap 사용자 정의 확인 프롬프트 효과 예제 공유의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!