Php jQuery移动菜单中的提交列表
我正在使用一个包含多个提交的表单来检测单击了哪个按钮,但是该列表在jQuery移动菜单中没有正确显示。我希望它看起来像(单击“菜单”按钮),但是它看起来像。(如果不是很明显,黑匣子是我编辑出来的。)我需要做什么才能让它像文档中那样将提交按钮折叠成一个漂亮的列表Php jQuery移动菜单中的提交列表,php,jquery,jquery-mobile,Php,Jquery,Jquery Mobile,我正在使用一个包含多个提交的表单来检测单击了哪个按钮,但是该列表在jQuery移动菜单中没有正确显示。我希望它看起来像(单击“菜单”按钮),但是它看起来像。(如果不是很明显,黑匣子是我编辑出来的。)我需要做什么才能让它像文档中那样将提交按钮折叠成一个漂亮的列表 <a href="#navmenu" data-rel="popup" data-role="button">Navigate to different section</a> <div data-r
<a href="#navmenu" data-rel="popup" data-role="button">Navigate to different section</a>
<div data-role="popup" id="navmenu">
<form name="navmenuform" action="X.php" method="post">
<ul data-role="listview" data-inset="true">
<li data-role="divider">Navigate to:</li>
<?php foreach ($array as $category) { ?>
<li><input type="submit" name="nav<?php echo $category[0]; ?>" value="Section <?php echo $category[0] . ": " . $category[1]; ?>"></li>
<?php } ?>
</ul>
</form>
</div>
- 导航到:
- 简单的回答是不要在listview项目中放置提交按钮(至少可见)。
问题是按钮和lisview项的内容区域有其样式
填充
,边距
,边框
,等等。您可以利用jQM提供的功能,而不必使用样式
我想,如果你可以使用GET
而不是POST
,那么实现你想要的最简单的方法是放弃表单,使用锚定来填充列表项,锚定href
到带有参数的适当URL,并使用rel=“external”
,如下所示:
<div data-role="popup" id="navmenu" style="min-width:210px;">
<ul data-role="listview" data-inset="true">
<li data-role="divider">Navigate to:</li>
<li><a rel="external" href="X.php?nav1=Section 1:1">Section 1:1</a></li>
<li><a rel="external" href="X.php?nav2=Section 1:2">Section 1:2</a></li>
<li><a rel="external" href="X.php?nav3=Section 1:3">Section 1:3</a></li>
<li><a rel="external" href="X.php?nav4=Section 1:4">Section 1:4</a></li>
</ul>
</div>
不要忘记将data ajax=“false”
放在您的表单
标签上,否则默认情况下jQM将尝试通过ajax提交表单
然后在列表项上使用单击事件,更改隐藏输入中的名称和值并提交表单:
$(document).on("pageinit", "#page1", function(){
$("#navmenu ul li a").click(function(e){
//Prevent default behavior since we need to submit the form instead of following the link
e.preventDefault();
//Change name and value attributes in out hidden input
$("#param").attr("name", $(this).attr("href")).val($(this).text());
//Submit the form
$("form[name=navmenuform]").submit();
});
});
这正是我需要的,你的解释很有道理。非常感谢你!
$(document).on("pageinit", "#page1", function(){
$("#navmenu ul li a").click(function(e){
//Prevent default behavior since we need to submit the form instead of following the link
e.preventDefault();
//Change name and value attributes in out hidden input
$("#param").attr("name", $(this).attr("href")).val($(this).text());
//Submit the form
$("form[name=navmenuform]").submit();
});
});