|
@@ -7,22 +7,21 @@
|
|
|
3、有三个按钮的多分支选择询问框。
|
|
|
4、输入文本值对话框。
|
|
|
----------------------------------------------------------------------------------------------------------------------->
|
|
|
-
|
|
|
-<div class="modal fade" id="hintBox" data-backdrop="static">
|
|
|
+<div class="modal fade" id="hintBox_form" data-backdrop="static">
|
|
|
<div class="modal-dialog" role="document">
|
|
|
<div class="modal-content">
|
|
|
-
|
|
|
<div class="modal-header">
|
|
|
- <h5 class="modal-title" id="hintBox_title">标题</h5>
|
|
|
+ <h5 id="hintBox_title" class="modal-title">标题</h5>
|
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
|
<span aria-hidden="true">×</span>
|
|
|
</button>
|
|
|
</div>
|
|
|
|
|
|
<div class="modal-body">
|
|
|
- <div id = "hintBox_info" style="margin:5px 10px 10px 10px;">提示明细</div>
|
|
|
+ <div id = "hintBox_caption" style="margin:5px 10px 10px 10px;">提示明细</div>
|
|
|
<div style="margin:5px 10px 5px 10px;">
|
|
|
- <input type="text" class="form-control" value="" id="hintBox_value"/>
|
|
|
+ <input id="hintBox_value" type="text" class="form-control" value="" />
|
|
|
+ <p id="hintBox_error" style="margin-top:7px; color:red; display:none;">“xxx”已存在!</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
@@ -36,78 +35,110 @@
|
|
|
</div>
|
|
|
|
|
|
<script>
|
|
|
- G_HINTBOX_VALUE = null;
|
|
|
- hintBoxButtonType = {yes: 1, yesNo: 2, yesNoCancel: 3};
|
|
|
- function speFont(str){
|
|
|
- return `<span style='color:red;font-weight:bold;font-size:15px'> ${str} </span>`;
|
|
|
- };
|
|
|
-
|
|
|
- function hintBox(title, caption, btnType, doYes, doNo) {
|
|
|
- $('#hintBox_title').text(title);
|
|
|
- $('#hintBox_info').html(caption);
|
|
|
+ const hintBox = {
|
|
|
+ test: false,
|
|
|
+ value: null,
|
|
|
+ btnType: {yes: 1, yesNo: 2, yesNoCancel: 3},
|
|
|
+ init: function (){
|
|
|
+ // 事件类
|
|
|
+ $("#hintBox_value").unbind();
|
|
|
+ $("#hintBox_btn_yes").unbind();
|
|
|
+ $('#hintBox_btn_no').unbind();
|
|
|
+ $('#hintBox_btn_cancel').unbind();
|
|
|
+
|
|
|
+ $("#hintBox_value").keyup(
|
|
|
+ function (event) {
|
|
|
+ hintBox.value = $('#hintBox_value').val();
|
|
|
+ if (event.keyCode === 13) {
|
|
|
+ $('#hintBox_btn_yes').click();
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ );
|
|
|
+ $('#hintBox_btn_cancel').click(
|
|
|
+ function () {
|
|
|
+ if (!hintBox.test)
|
|
|
+ $.bootstrapLoading.end();
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ );
|
|
|
+
|
|
|
+ // 显示类
|
|
|
+ $('#hintBox_caption').hide();
|
|
|
+ $('#hintBox_value').hide();
|
|
|
+ $('#hintBox_error').hide();
|
|
|
+ $('#hintBox_btn_yes').hide();
|
|
|
+ $('#hintBox_btn_no').hide();
|
|
|
+ $('#hintBox_btn_cancel').hide();
|
|
|
+ },
|
|
|
+ font: function(str){
|
|
|
+ return `<span style='color:red;font-weight:bold;font-size:15px'> ${str} </span>`;
|
|
|
+ },
|
|
|
+ error: function (err) { // 注意:该方法只能用在valueBox()的doOK回调函数中。
|
|
|
+ $('#hintBox_error').text(err);
|
|
|
+ $('#hintBox_error').show(200);
|
|
|
+ $("#hintBox_value").focus();
|
|
|
+ $("#hintBox_value").select();
|
|
|
+ },
|
|
|
+ infoBox: function (title, caption, btnType, doYes, doNo) {
|
|
|
+ this.init();
|
|
|
+ $('#hintBox_title').text(title);
|
|
|
+ $('#hintBox_caption').html(caption);
|
|
|
+ $('#hintBox_caption').show();
|
|
|
+
|
|
|
+ switch (btnType) {
|
|
|
+ case this.btnType.yes:
|
|
|
+ $('#hintBox_btn_yes').text('确定');
|
|
|
+ $('#hintBox_btn_yes').show();
|
|
|
+ break;
|
|
|
+ case this.btnType.yesNo:
|
|
|
+ $('#hintBox_btn_yes').text('是');
|
|
|
+ $('#hintBox_btn_no').text('否');
|
|
|
+ $('#hintBox_btn_yes').show();
|
|
|
+ $('#hintBox_btn_no').show();
|
|
|
+ break;
|
|
|
+ case this.btnType.yesNoCancel:
|
|
|
+ $('#hintBox_btn_yes').text('是');
|
|
|
+ $('#hintBox_btn_no').text('否');
|
|
|
+ $('#hintBox_btn_cancel').text('取消');
|
|
|
+ $('#hintBox_btn_yes').show();
|
|
|
+ $('#hintBox_btn_no').show();
|
|
|
+ $('#hintBox_btn_cancel').show();
|
|
|
+ break;
|
|
|
+ }
|
|
|
|
|
|
- $('#hintBox_value').hide();
|
|
|
- $('#hintBox_info').show();
|
|
|
- $('#hintBox_btn_yes').show();
|
|
|
- $('#hintBox_btn_yes').text('是');
|
|
|
- $("#hintBox_btn_yes").unbind();
|
|
|
- $('#hintBox_btn_no').show();
|
|
|
- $('#hintBox_btn_no').text('否');
|
|
|
- $('#hintBox_btn_no').unbind();
|
|
|
- $('#hintBox_btn_cancel').show();
|
|
|
- $('#hintBox_btn_cancel').text('取消');
|
|
|
- $('#hintBox_btn_cancel').unbind();
|
|
|
+ if (doYes){
|
|
|
+ $('#hintBox_btn_yes').click(doYes);
|
|
|
+ }
|
|
|
|
|
|
- switch (btnType) {
|
|
|
- case hintBoxButtonType.yes:
|
|
|
- $('#hintBox_btn_yes').text('确定');
|
|
|
- $('#hintBox_btn_no').hide();
|
|
|
- $('#hintBox_btn_cancel').hide();
|
|
|
- break;
|
|
|
- case hintBoxButtonType.yesNo:
|
|
|
- $('#hintBox_btn_cancel').hide();
|
|
|
- break;
|
|
|
- }
|
|
|
+ if (doNo){
|
|
|
+ $('#hintBox_btn_no').click(doNo);
|
|
|
+ }
|
|
|
|
|
|
- if (doYes){
|
|
|
- $('#hintBox_btn_yes').click(doYes);
|
|
|
- }
|
|
|
+ $("#hintBox_form").modal('show');
|
|
|
|
|
|
- if (doNo){
|
|
|
- $('#hintBox_btn_no').click(doNo);
|
|
|
- }
|
|
|
+ },
|
|
|
+ valueBox: function (title, value, doOK) {
|
|
|
+ this.init();
|
|
|
+ $('#hintBox_title').text(title);
|
|
|
+ this.value = value;
|
|
|
+ $('#hintBox_value').show();
|
|
|
+ $('#hintBox_value').val(value);
|
|
|
+ $("#hintBox_value").focus();
|
|
|
+ $("#hintBox_value").select();
|
|
|
|
|
|
- $('#hintBox_btn_cancel').click(
|
|
|
- function () {return;}
|
|
|
- );
|
|
|
+ $('#hintBox_btn_yes').text('确定');
|
|
|
+ $('#hintBox_btn_yes').show();
|
|
|
+ $('#hintBox_btn_yes').click(doOK); // doOK不能给参数
|
|
|
|
|
|
- $("#hintBox").modal({show:true});
|
|
|
+ $("#hintBox_form").modal('show');
|
|
|
+ }
|
|
|
};
|
|
|
|
|
|
- function hintBoxValue(title, value, doYes) {
|
|
|
- $('#hintBox_title').text(title);
|
|
|
-
|
|
|
- $('#hintBox_info').hide();
|
|
|
- G_HINTBOX_VALUE = value;
|
|
|
-
|
|
|
- $('#hintBox_value').show();
|
|
|
- $('#hintBox_value').val(value);
|
|
|
- $("#hintBox_value").unbind();
|
|
|
- $("#hintBox_value").change(
|
|
|
- function () {
|
|
|
- G_HINTBOX_VALUE = $('#hintBox_value').val();
|
|
|
- }
|
|
|
- );
|
|
|
-
|
|
|
- $('#hintBox_btn_yes').show();
|
|
|
- $('#hintBox_btn_yes').text('确定');
|
|
|
- $('#hintBox_btn_yes').unbind();
|
|
|
- $('#hintBox_btn_yes').click(doYes); // doYes不能给参数
|
|
|
-
|
|
|
- $('#hintBox_btn_no').hide();
|
|
|
- $('#hintBox_btn_cancel').hide();
|
|
|
-
|
|
|
- $("#hintBox").modal({show:true});
|
|
|
- };
|
|
|
+ $('#hintBox_form').on('hide.bs.modal', function() {
|
|
|
+ if (!hintBox.test)
|
|
|
+ $.bootstrapLoading.end();
|
|
|
+ return;
|
|
|
+ });
|
|
|
</script>
|
|
|
|