1
앱의 헤더 버튼을 페이지에 삽입 된 양식으로 시작하려고합니다. 이것이 가능한지 또는 JS가 그것을 달성하기 위해 어떻게 보이는지에 대한 아이디어가 없습니까?페이지 요소가있는 Jquery Mobile 대화 상자
<div data-role="header" class="ui-header ui-bar-a" role="banner">
<h1 class="ui-title" tabindex="0" role="heading" aria-level="1">Devices</h1>
<a class="ui-btn-right ui-btn ui-btn-icon-left ui-btn-corner-all ui-shadow ui-btn-down-a ui-btn-up-a" data-icon="gear" data-rel="dialog" data-transition="flip" href="#filter_form" data-theme="a"><span class="ui-btn-inner ui-btn-corner-all"><span class="ui-btn-text">Options</span><span class="ui-icon ui-icon-gear ui-icon-shadow"></span></span></a>
</div>
<!-- other page stuff -->
<div id='filter_form' style='display: none'>
<h3>Device Criteria</h3>
<form accept-charset="UTF-8" action="/devices" method="get">
<div data-role='fieldcontain'>
...
</div>
<div>
<button data-theme='a'>Submit</button>
</div>
</form>
</div>
<script>
//<![CDATA[
$(function(){
$('.show_filter_form').click(function(){
console.log("in click handler")
$.mobile.changePage($('#filter_form form'), {transition: 'pop', changeHash: false, role: 'dialog'});
return false;
})
})
//]]>
</script>
클릭이 발생하지만 머리글에 스타일이없는 뒤로 버튼을 제외한 페이지에서 아무런 변화가 없습니다.
당신은 어떤 아이디어가 있다면 내가 설정 그것을 위해 JS 바이올린했습니다 : 당신의 JS 코딩에 관한 http://jsfiddle.net/BHMmP/