如何通过jquery.mobile.scrollview.js滚动下拉列表中的复选框?

时间:2012-02-22 11:30:39

标签: jquery-mobile

我已经实现了Jquery.mobile.scrollview.js并且我能够滚动下拉列表,但是当我点击滚动下拉列表中的复选框时,复选框变得不可见并且只显示文本。那里有任何解决方法......请让我知道..

这有什么例子.....我在下面添加我的代码..并在我的div部分给出data-scroll ='y'...

<!-- Scroll View code -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
        #evtCatcher
        {
        }
        #evtCatcher .ui-scrollview-view
        {
            padding: 10px;
        }
    </style>

    <script src="jsScroll/jquery.js" type="text/javascript"></script>

    <script src="jsScroll/jsdefault.js" type="text/javascript"></script>

    <script src="jsScroll/jquery.easing.1.3.js" type="text/javascript"></script>

    <script src="jsScroll/jquery.mobile.scrollview.js" type="text/javascript"></script>

    <script src="jsScroll/iscroll.js" type="text/javascript""></script>


   <script type="text/javascript">

        function fnClick() {

            alert('clicked');
        }

    </script>

  <script>
        $("[ data-role=page]").live("pageshow", function(event) {
            var $page = $(this);
            $page.find("[data-scroll]:not(.ui-scrollview-clip)").each(function() {
                var $this = $(this);
                // XXX: Remove this check for ui-scrolllistview once we've
                //      integrated list divider support into the main scrollview class.
                if ($this.hasClass("ui-scrolllistview"))
                    $this.scrolllistview();
                else {
                    var st = $this.data("scroll") + "";
                    var paging = st && st.search(/^[xy]p$/) != -1;
                    var dir = st && st.search(/^[xy]/) != -1 ? st.charAt(0) : null;

                    var opts = {};
                    if (dir)
                        opts.direction = dir;
                    if (paging)
                        opts.pagingEnabled = true;

                    $this.scrollview(opts);
                }
            });

            changeDelayFormElementClick();
        });

        function changeScrollMethod() {
            var val = $("#s_method").val();
            var $sv = $("#evtCatcher").scrollview("scrollTo", 0, 0);
            if (val === "scroll") {
                $sv.css("overflow", "scroll");
            }
            else {
                $sv.css("overflow", "hidden");
            }
            $sv.data("scrollview").options.scrollMethod = val;
        }

        function changeDelayFormElementClick() {
            $("#evtCatcher").data("scrollview").options.delayedClickEnabled = ($("#s_delay").val() === "yes");
        }

        var cb_hd_pd,
    cb_hd_sp,
    cb_hm_pd,
    cb_hm_sp,
    cb_hu_pd,
    cb_hu_sp;

        var hd = $.mobile.scrollview.prototype._handleDragStart;
        var hm = $.mobile.scrollview.prototype._handleDragMove;
        var hu = $.mobile.scrollview.prototype._handleDragStop;

        function getDummyEvent(o) {
            return { target: o.target, _pd: false, _sp: false, preventDefault: function() { this._pd = true; }, stopPropagation: function() { this._sp = true; } };
        }

        function updateEvent(e, cb_pd, cb_sp) {
            if (cb_pd.checked)
                e.preventDefault();
            if (cb_sp.checked)
                e.stopPropagation();
        }

        $.mobile.scrollview.prototype._handleDragStart = function(e, x, y) {
            hd.call(this, getDummyEvent(e), x, y);
            updateEvent(e, cb_hd_pd, cb_hd_sp);
        };

        $.mobile.scrollview.prototype._handleDragMove = function(e, x, y) {
            hm.call(this, getDummyEvent(e), x, y);
            updateEvent(e, cb_hm_pd, cb_hm_sp);
        };

        $.mobile.scrollview.prototype._handleDragStop = function(e) {
            hu.call(this, getDummyEvent(e));
            updateEvent(e, cb_hu_pd, cb_hu_sp);
        };

        $(function() {
            cb_hd_pd = $("#cb_hd_pd")[0];
            cb_hd_sp = $("#cb_hd_sp")[0];
            cb_hm_pd = $("#cb_hm_pd")[0];
            cb_hm_sp = $("#cb_hm_sp")[0];
            cb_hu_pd = $("#cb_hu_pd")[0];
            cb_hu_sp = $("#cb_hu_sp")[0];
        });
    </script>

提前致谢:)

0 个答案:

没有答案