在使用Jquery UI对话框并访问它时设置变量

Question

这是我想要实现的目标，但它让我“未定义”。它会在对话框打开之前触发，有什么不对的＆amp;在哪里？

$(".shipment_refund").click(function (e) {
    e.preventDefault();
    var sel_option;
    var dialog = $('<p>Are you sure you want to refund this shipment? If yes then</p>').dialog({
            buttons: {
                    "With Shipment fee?": function() {sel_option = 1;},
                    "Without Shipment fee?":  function() {sel_option = 0;},
                    "Cancel":  function() {                            
                            dialog.dialog('close');
                    }
            }
    });
    alert(sel_option);
});

Answer 1

尝试这样做会有希望如此

$(".shipment_refund").click(function (e) {
        e.preventDefault();
        var sel_option;
        var dialog = $('<p>Are you sure you want to refund this shipment? If yes then</p>').dialog({
                buttons: {
                        "With Shipment fee?": function() {sel_option.val(1);},
                        "Without Shipment fee?":  function() {sel_option.val(0);},
                        "Cancel":  function() {                            
                                dialog.dialog('close');
                        }
                }
        });
        alert(sel_option);
    });

Answer 2

这对你有用。

我创建了jsFiddle您也可以查看。

编辑：调整以添加功能和按钮以从对话框中返回用户选择的值。

$(document).ready(function(){
	var choice;
    function doSomething (x) {
	  if(x != null) {
  	    return x;
      }
    }
  	$( "#dialog" ).dialog({ 
    					autoOpen: false, 
              buttons: {
                        "With Shipment fee?": {
                        				text: 'With Shipment fee?',
                                click: function() {
                                	choice = 1;
                                }
                        },
                        "Without Shipment fee?":  {
                        				text: 'Without Shipment fee?',
                                click: function() {
                                	choice = 0;
                                }
                        },
                        "Cancel": {
                        					text: 'Cancel',
                        					click: function() {
                                  	$("#dialog").dialog('close');
                                  }
                        }                           
                          
                        
                }
     });
    
    
		$( "#opener" ).click(function() {
  			$( "#dialog" ).dialog( "open" );
		});
        
         $("#storedValue").click(function(){
	       var userChoice = doSomething(choice);
        	if(userChoice != null){
  	          alert(userChoice);
              // clear choice
              choice = null;
            }else {
  	          alert("User did not chose a recordable answer.");
            }
         });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<button id="opener">open the dialog</button>
<div id="dialog" title="Refund">Are you sure you want to refund this shipment? If yes then (make selection and close dialog)</div>
<button id="storedValue">
Get Answer
</button>

Answer 3

这就是我实现我想要的目标：

var sel_option;

$(".shipment_refund").click(function (e) {
    e.preventDefault();
    var dialog = $('<p>Are you sure you want to refund this shipment? If yes then</p>').dialog({
        buttons: {
            "With Shipment fee?": function () {
                sel_option = 1;
                shipment_refund(e);
                dialog.dialog('close');
            },
            "Without Shipment fee?": function () {
                sel_option = 0;
                shipment_refund(e);
                dialog.dialog('close');
            },
            "Cancel": function () {
                dialog.dialog('close');
            }
        }
    });
});