Question

我有一个jquery移动页面，其中包含一个按钮，在点击时应显示/隐藏div。我似乎错过了一些东西。我在SO上遇到过类似的问题没有成功，有人能说出我哪里出错了吗？

HTML：

<a href="#" id="moreFilters" class="moreFilters" data-role="button">View more filters</a>
<div id="filters"> Blah </div>

CSS：

div#filters {
    display: none;
}

JQ：

$('#myPage').live('pageinit', function(event) {
    $("#moreFilters").bind('tap',function(event, ui){
        $('#filters').toggle('fast', function() {});
    })
});

我也试过了：

$('#moreFilters').live('tap',function(event) {
    $("#filters").toggle(); //  toggles the visibility/display of the element.
});

有人能指出我正确的方向吗？

非常感谢提前

Answer 1

你可以做这样的事吗，

<script>
    var isMenuVisible = true

    function showHideMenu() {
        isMenuVisible = !isMenuVisible;
        var menuPrin= document.getElementById("divMenu");

        if(isMenuVisible) {
            menuPrin.style.visibility = "visible";
            menuPrin.style.width = "30%";
        } else {
            menuPrin.style.visibility = "hidden";
            menuPrin.style.width = "0%";
        }
    }
</script>

这个script可以把它放在页面的末尾。

现在，将id="divMenu"指向要在触发事件的元素上隐藏，确定和div功能的onclick="showHideMenu();"。

所有这些都模拟了tap和toggle事件。

我希望这会有所帮助。：）

Jquery移动显示/隐藏div

1 个答案: