Question

所以我正在创建一个调查应用程序，根据一个调查页面的选定选项，一旦用户点击“开始”，就会加载两个页面中的一个。在确定将哪个链接加载到go按钮的href属性中时，我还将链接分配给将来的调查页面的“后退”按钮...我很困惑为什么这会返回undefined，因为我之前在做同样的事情应用程序和后退按钮的链接返回正确的链接...

所以在调用setSurveyFromSurvey5a（）之后，一旦用户从survey5a点击'go'，console.log（$（“＃survey5bback”）。attr（“href”））就会返回'undefined'，即使它应该是在setSurveyFromSurvey5a（）中分配...它将传递条件以设置href值，但它只是没有改变它，我不知道为什么......

这是我的代码：

相关的javascript：

    function setSurveyFromSurvey5a(){
        if(goto5a){
            survey5adata.alo_wthfam = translateCheckBox($("#checkbox-alo_wthfam").prop("checked"));
            survey5adata.alo_wthpart = translateCheckBox($("#checkbox-alo_wthpart").prop("checked"));
            survey5adata.alo_wthwork = translateCheckBox($("#checkbox-alo_wthwork").prop("checked"));
            survey5adata.alo_wthfr = translateCheckBox($("#checkbox-alo_wthfr").prop("checked"));
            survey5adata.alo_wthoth = translateCheckBox($("#checkbox-alo_wthoth").prop("checked"));
        }

        //set go and back buttons:
        if(survey5adata.alo_wthfam == 2){
            goto5a1 = true;
            console.log("within survey5adata.alo_wthfam == 2");
            $("#survey5ago").attr("href", "#survey5a1");
            $("#survey5bback").attr("href", "#survey5a1");
        }
        else if(survey5adata.alo_wthfam == 1){
            console.log("within survey5adata.alo_wthfam == 1");
            goto5a1 = false;
            $("#survey5ago").attr("href", "#survey5b");
            $("#survey5bback").attr("href", "#survey5a");
        }

        console.log("#survey5ago:" + $("#survey5ago").attr("href"));
        console.log("#survey5bback:" + $("#survey5bback").attr("href"));
    }

来自survey5a，survey5a1和调查5b的html：

<div data-role="page" id="survey5a">
    <header data-role="header" data-theme="c">
        <img src="img/evl_logo2.png" class="evllogo" width="100"/>
        <img src="img/uic_logo2.png" class="ui-btn-right" width="100"/>
    </header>
    <div data-role="header" data-theme="e">
        <p>Tobacco Use Interview</p>
    </div>



    <div data-role="content">
        <div id="survey5acontent">
        </div>
    </div>


    <div data-role="footer" data-position="fixed">
        <div data-role="navbar">
            <ul>
                <li><a href="#survey4">Back</a></li>
                <li><a href="#main">Home</a></li>
                <li><a href="#" id="survey5ago" onclick="setSurveyFromSurvey5a()">Go</a></li>
            </ul>
        </div>
    </div>
</div>

<!-- LINKED SURVEY5a1 -->

<div data-role="page" id="survey5a1">
    <header data-role="header" data-theme="c">
        <img src="img/evl_logo2.png" class="evllogo" width="100"/>
        <img src="img/uic_logo2.png" class="ui-btn-right" width="100"/>
    </header>
    <div data-role="header" data-theme="e">
        <p>Tobacco Use Interview</p>
    </div>



    <div data-role="content">
        <div id="survey5a1content">
        </div>
    </div>


    <div data-role="footer" data-position="fixed">
        <div data-role="navbar">
            <ul>
                <li><a href="#survey5a">Back</a></li>
                <li><a href="#main">Home</a></li>
                <li><a href="#survey5b">Go</a></li>
            </ul>
        </div>
    </div>
</div>

<!-- LINKED SURVEY5b -->

<div data-role="page" id="survey5b">
    <header data-role="header" data-theme="c">
        <img src="img/evl_logo2.png" class="evllogo" width="100"/>
        <img src="img/uic_logo2.png" class="ui-btn-right" width="100"/>
    </header>
    <div data-role="header" data-theme="e">
        <p>Tobacco Use Interview</p>
    </div>



    <div data-role="content">
        <div id="survey5bcontent">
        </div>
    </div>


    <div data-role="footer" data-position="fixed">
        <div data-role="navbar">
            <ul>
                <!-- Need to determine how to go back correctly -->
                <li><a href="#" id="#survey5bback">Back</a></li>
                <li><a href="#main">Home</a></li>
                <li><a href="#survey6">Go</a></li>
            </ul>
        </div>
    </div>
</div>

Answer 1

您的HTML标记中只有一个拼写错误：

<li><a href="#" id="#survey5bback">Back</a></li>

应该是

<li><a href="#" id="survey5bback">Back</a></li>

从ID中删除“＃”。

JQuery Mobile App-将Navbar链接更新中的href属性更新为'undefined'

1 个答案: