OnClick工程仅在重新加载后使用jquerymobile工作 [英] OnClick works only works after reload, using jquerymobile

查看:193
本文介绍了OnClick工程仅在重新加载后使用jquerymobile工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我知道这是一个常见的问题,但没有答案(到现在为止)适合我。

I know it's an often asked question, but no answer (till now) fits for me.

我用 Cordova写了一个移动应用程序。 strong>我也在浏览器(Firefox)中测试应用程序。我使用的是jQuery和jq mobile。

I wrote a mobile app with Cordova. I'm also testing apps in browser (Firefox). I'm using jQuery and jq mobile.

问题是:我的 OnClick 这是不可能在手机上,甚至在pc上真的不是一个解决方案。

The problem is: my OnClick events on work only after refresh, which isn't possible on mobile and even on pc not really an solution.

更新:我读到,ehader没有加载jQuery移动。因此,我按照thsi解决方案中的说明进行处理:网页加载方式不同jQuery-mobile transition

Update: I read about, that the ehader isn't loaded again in jQuery mobile. So I treid it as described in thsi solution: page loaded differently with jQuery-mobile transition

无法运作。

alert(); 您会看到,脚本运行一次,但在网站完全构建之前。

And with alert(); you see, that the script runs once but before the site is totally build.

我的html:

<div data-role="main" class="ui-content" id="container" >
            <div id="container0">
                <a data-role="button"  id="anchor0" >Neuen Termin Hinzufügen</a>
            </div>
        </div>

最初< a> onclick < a onClick> =doStuff()

这里是我的不同尝试:

$(function () {


         // Assign the click handler on DOM-ready
         $('a').on('click', function () {
         dateElementClicked(this);
         });
         });

        $(document).ready($(function () {


                // Assign the click handler on DOM-ready
                $('a').on('click', function () {
                    dateElementClicked(this);
                });
            })
        );

        $("#anchor0").live("click", dateElementClicked($("#anchor0")));

        $("a").click( dateElementClicked(this));

$("a").bind("click", function (event, ui){
            dateElementClicked(this);
        });

它们只有在刷新后才能工作。或

They all work only after an refresh. or the first one runs the function instant and interupts everything because "this" is undefined.

编辑

我甚至尝试它与按钮和inpute类型按钮和额外的js文件。但我的javascript只有在刷新后运行...在脚本中放了控制台日志和警报。所以整个脚本卡在某种方式

I even tried it with button and inpute type button and made extra js file. but my javascript only runs after an refresh... Putted an console log and alert in the script. So the whole script is stuck somehow

日期元素点击函数(我也清除了这也测试,只是把一个 alert() in it)

The dateelement clicked function (I cleared this too for testing and just put an alert() in it)

这是项目的git链接: https://github.com/LosKartoflos/Apoll.git

Here is the git link to the project: https://github.com/LosKartoflos/Apoll.git

function dateElementClicked(clickedAnchor) {
            //anchor is clicked the first time(the id number equals numberOfAppointments)
            if (clickedAnchor.id.slice(-1) == numberOfAppointments) {
                dateElementClickedFirstTime(clickedAnchor);
            }
            else if (appointmentList[getDateElementNumber(clickedAnchor)]["RolledOut"] == true)
            {
                hideContent(getDateElementNumber(clickedAnchor));
            }
            else if (appointmentList[getDateElementNumber(clickedAnchor)]["RolledOut"] == false)
            {
                showContent(getDateElementNumber(clickedAnchor));
            }
            else
            {
                alert("Element not listed");
            }
        }

BTW:我的脚本是我的html文件。

BTW: my script isin my html file.

推荐答案

好的问题是,Cordova正在搞乱正常构建/加载oder。

okay the Problem is, that Cordova is messing around with normal build/loading oder. to trigger functions, after the side is loaded.

Cordova纪录片推荐这两种解决方案:

The Cordova Documentary recommends this two solutions:

并在onload或dofirst中绑定您的事件。

Put this in your header and bind your events in the onload or dofirst. An do everything you want to be have done, after page is ready, in the do first:

<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
    <script src="js/script.js" type="text/javascript"></script>
    <script type="text/javascript" charset="utf-8">


        // Wait for device API libraries to load
        //add all Events (click Events)
        function onLoad() {
            document.addEventListener("deviceready", doFirst(), false);
            document.getElementById("anchor").addEventListener("click", clickedFunction, false);
        }

        // device APIs are available
        function onDeviceReady() {


        }


        //things to put up first
        function doFirst() {

        }

    </script>

或将其放在onDeviceReady函数中,在自动创建的index.js中。

or put it in the onDeviceReady function, in the auto created index.js .

 // deviceready Event Handler
//
// The scope of 'this' is the event. In order to call the 'receivedEvent'
// function, we must explicitly call 'app.receivedEvent(...);'
onDeviceReady: function() {
    document.getElementById("anchor0").addEventListener("click", clicked, false);
    app.receivedEvent('deviceready');

},

这里的纪录片: https://cordova.apache.org/docs/en/4.0.0/cordova_events_events.md。 html

我推出了jquery和jquery mobile。 Jquery弄乱了文档准备和jquery移动防止头部beeing再次加载。

And i kicked out jquery and jquery mobile. Jquery was messing around with document ready and jquery mobile prevents the head from beeing loaded again.

这篇关于OnClick工程仅在重新加载后使用jquerymobile工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆