我正在尝试用 jQM 对话框替换 JavaScript prompt() 函数。我的目标是提示用户输入一个字符串,然后当他们提交(提交按钮或输入)时,使用他们输入的字符串运行一个函数。
详细来说,我想取消按钮和[x]关闭对话框并返回页面,什么都不做;我希望提交按钮将#strAccount 值传递给函数。这很容易在没有表单等的情况下完成。但是,我还希望用户能够在#strAccount 字段中按回车键。我认为最简单的方法是让它成为一个表单——因此,提交和输入都会提交。
我发现我需要在提交表单时返回 false。但是,完成所有这些操作后,页面正在重新加载,这是我不想要的。
以下是一些主页内容:
<div id="NewEntry" data-role="page" data-title="New Time Entry">
<h3>Timesheet </h3>
<a id="openDialog" data-rel="dialog">Get account name...</a>
</div>
这是对话框:
<div id="accountEntry" data-role="dialog">
<div data-role="header">
<h1>Filter by Account Name</h1>
</div>
<div data-role="content">
<form id="acctNameFilter" data-rel="back" data-ajax="false">
<p>Enter two or more letters from any part of the account name below:</p>
<input type="text" id="strAccount" placeholder="Enter any part of account name" autocomplete="off">
<a href="#NewEntry" data-role="button" data-rel="back" data-icon="delete" data-inline="true">Cancel</a>
<input type="submit" data-theme="b" data-icon="check" data-inline="true" value="Submit">
</form>
</div>
</div>
这是我的页面脚本:
$(document).ready(function()
{
alert('page loading...'); //alert me if page reloads
$('#acctNameFilter').submit(function()
{
alert($('#strAccount').val()); //did it get passed?
getAcctsByString($('#strAccount').val()); //the function I want to run
$('#strAccount').val(''); //clear out the dialog's value... (necessary?)
$('#accountEntry').dialog('close');
return false; //stop execution, I thought...
});
//#openDialog is a simple href link...
$('#openDialog').click(function()
{
$.mobile.changePage('#accountEntry',{changeHash: false});
});
}
#strAccount
另一个不太重要的问题:在对话框加载后如何设置焦点?我想尽量减少用户的压力。
提前谢谢了。