将值返回到jquery对话框中的函数

本文介绍了将值返回到jquery对话框中的函数的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在使用jquery对话框jquery。我有一些功能的条件。我已经预付了一个类似于实际代码的演示，它在本地工作，但是没有在小提琴中工作。我想要的是当用户点击打开框，然后根据用户选择我们相应地改变。但问题是当用户点击打开框正在改变按摩时。直到用户选择他的选择才等待。我想用功能等待用户选择他的选项然后提醒。

 < HEAD> 
< link rel =stylesheethref =http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css/> 
< script src =http://code.jquery.com/jquery-1.9.1.js>< / script> 
< script src =http://code.jquery.com/ui/1.10.3/jquery-ui.js>< / script> 
< / head> 
< body> 
 
< a href =javascript：checkvisible（0）>打开框< / a> 
 
< div id =dialog> 
< p>这是用于显示信息的默认对话框。可以使用x图标移动，调整大小并关闭对话窗口。< / p> 
< / div> 
< / body> 
 
< script type =text / javascript> 
 var val = $（'＃dialog'）。dialog（{autoOpen：false，buttons：{
OK：function（）{
 $（this）.dialog ）; 
 return true; 
}，
cancel：function（）{
 $（this）.dialog（close）; 
 return false ; 
} 
}}）; 
 
函数openTo（Id_，width_）{
 var divId = $（'＃'+ Id_）; 
 divId.dialog（'option'，'width'，parseInt（width_））; 
 divId.dialog（'option'，'show'，'clip'）; 
 divId.dialog（'option'，'hide'，'clip'）; 
 divId.dialog（'option'，'zIndex'，1000）; 
 divId.dialog（'open'）; 
} 
 
 function showbox（）{
 openTo（'dialog'，200）
} 
 
函数checkvisible（notes）{
 if（notes）{
 // do something 
} 
 
 else {
 var procees = showbox（）; 
 if（procees）{
 alert（'ok'）
} 
 else {
 alert（'cancelled）
} 
} 
} 
< / script> 
< / html>

解决方案

对话窗口小部件异步工作，所以你不会得到从它返回的任何值。解决方案是使用自定义事件处理程序和回调

  jQuery（function（$）{
 var val = $ '#dialog'）对话框（{
 autoOpen：false，
按钮：{
OK：function（）{
 $（this）.dialog（close ）; 
 $（this）.trigger（'confirm'）; 
}，cancel：function（）{
 $（this）.dialog（close）; 
 $（this）.trigger（'cancel'）; 
} 
} 
}）; 
}）
 
 
函数openTo（Id_，width_，okCallback，cancelCallback）{
 var divId = $（'＃'+ Id_）; 
 divId.dialog（'option'，'width'，parseInt（width_））; 
 divId.dialog（'option'，'show'，'clip'）; 
 divId.dialog（'option'，'hide'，'clip'）; 
 divId.dialog（'option'，'zIndex'，1000）; 
 divId.dialog（'open'）。off（'confirm cancel'）。on（'confirm'，okCallback）.on（'cancel'，cancelCallback）; 
} 
 
函数showbox（okCallback，cancelCallback）{
 openTo（'dialog'，200，okCallback，cancelCallback）
} 
 
函数checkvisible（note）{
 if（notes）{
 // do something 
} else {
 showbox（function（）{
 alert（'ok'） 
}，function（）{
 alert（'cancelled）'
}）; 
} 
}

演示：

I am using jquery dialog box jquery. I have some condition in function. I have prepaid a demo similar like actual code it is working on local but however not working in the fiddle. What i want is when user click 'open box' then based on user selection we alter accordingly. But the problem is when user is clicking 'open box' is altering massage. It is not waiting till the user choose his selection. I want to do with function wait till user select his option then alert. fiddle

<head>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
</head>
<body>

<a href="javascript:checkvisible(0)">open box</a>

<div id="dialog" >
<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>
</body>

<script type="text/javascript">
 var val= $('#dialog').dialog({autoOpen: false,  buttons: {
"OK": function () {
$(this).dialog("close");
return true;
},
"cancel": function () {
$(this).dialog("close");
return false;
}
}});

function openTo(Id_, width_) {
var divId = $('#' + Id_);
divId.dialog('option', 'width', parseInt(width_));
divId.dialog('option', 'show', 'clip');
divId.dialog('option', 'hide', 'clip');
divId.dialog('option', 'zIndex', 1000);
divId.dialog('open');
}

function showbox (){
openTo('dialog',200)
}

function checkvisible(notes){
if(notes){
// do something
}

else {
var procees= showbox();
if(procees){
alert('ok')
}
else {
alert('cancelled')
}
}
}
</script>
</html>

解决方案

The dialog widget work asynchronously, so you will not get any value returned from it. The solution is to use custom event handlers and callbacks

jQuery(function ($) {
    var val = $('#dialog').dialog({
        autoOpen: false,
        buttons: {
            "OK": function () {
                $(this).dialog("close");
                $(this).trigger('confirm');
            }, "cancel": function () {
                $(this).dialog("close");
                $(this).trigger('cancel');
            }
        }
    });
})


function openTo(Id_, width_, okCallback, cancelCallback) {
    var divId = $('#' + Id_);
    divId.dialog('option', 'width', parseInt(width_));
    divId.dialog('option', 'show', 'clip');
    divId.dialog('option', 'hide', 'clip');
    divId.dialog('option', 'zIndex', 1000);
    divId.dialog('open').off('confirm cancel').on('confirm', okCallback).on('cancel', cancelCallback);
}

function showbox(okCallback, cancelCallback) {
    openTo('dialog', 200, okCallback, cancelCallback)
}

function checkvisible(notes) {
    if (notes) {
        // do something
    } else {
        showbox(function(){
            alert('ok')
        }, function(){
            alert('cancelled')
        });
    }
}

Demo: Fiddle

这篇关于将值返回到jquery对话框中的函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

Till

将值返回到jquery对话框中的函数

问题描述