[英]Unable get the value of textarea inside jquery ui dialog
I tried to put a textarea inside a dialog box and what I want is to get the value of that textarea if "ok" is click but I can't get the value. 我试图在对话框中放置一个textarea,如果单击“确定”,但我想获取该textarea的值,但我无法获取该值。 What might be the problem? 可能是什么问题?
$(document).on('click', '#open', function () { var txt = $('#txt').val(); $('#break-diag').dialog({ modal: true, title: 'Dialog', show: { effect: "scale", duration: 200 }, resizable: false, buttons: [{ text: "ok", click: function () { console.log(txt); } }] }); });
#break-diag{ display:none; }
<link href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <button id="open">Open Dialog</button> <div id="break-diag"> <textarea id="txt"></textarea> </div>
You are capturing the textarea value on click of open; 单击打开即可捕获textarea值; which would be empty during this event. 在此事件期间将为空。
The value should be captured on click of Ok 单击确定即可捕获该值
click: function () {
var txt = $('#txt').val();
console.log(txt);
}
You're trying to get the text when the dialogue opens. 对话框打开时,您正在尝试获取文本。 There's no text there, yet. 那里还没有文字。
$(document).on('click', '#open', function () { $('#break-diag').dialog({ modal: true, title: 'Dialog', show: { effect: "scale", duration: 200 }, resizable: false, buttons: [{ text: "ok", click: function () { var txt = $('#txt').val(); console.log(txt); } }] }); });
#break-diag{ display:none; }
<link href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <button id="open">Open Dialog</button> <div id="break-diag"> <textarea id="txt"></textarea> </div>
$(document).on('click', '#open', function () {
$('#break-diag').dialog({
modal: true,
title: 'Dialog',
show: {
effect: "scale",
duration: 200
},
resizable: false,
buttons: [{
text: "ok",
click: function () {
var text= $('#txt').val();
alert(text);
}
}]
});
});
You set the CSS style display:none with #break-diag DIV. 您设置CSS样式显示: #break-diag DIV设置为none 。
so how can you imagine that anything can be display. 所以你怎么能想象任何东西都可以显示。
so when you click on the button, display:none property should be removed from #break-diag DIV . 因此,当您单击按钮时, display:none属性应从#break-diag DIV中删除。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.