jquery mobile window.location.href Page jump error

Question

help me! I use window.location.href jump page but it is wrong code:

jquery

function  onclick(){
     window.location.href="#main"
}

<div data-role="page" id="login" class="ui-body-e">
<div data-role="content">   
        <input type="button" onClick="onclick()" value="ok"/>       
</div>
<div data-role="page" id="main" class="ui-body-e">
<div data-role="content">   
        <li><a href="#login">Login</a>      
</div>
</div>

error: E:\\Dockmate_hbx10\\Dockmate\\assets\\www\\ contains invalid path. Sometimes can be the jump,This is why?

Answer 1

If you just want to use a button as a link, you may consider the following solution:

Use:

<a data-role="button" href="#main"></a>

instead of:

<input type="button" value="ok"/>  

So, your code would look like something like this:

jQuery: none

HTML:

<div data-role="page" id="login" class="ui-body-e">
    <div data-role="content">   
        <a data-role="button" href="#main"></a>
    </div>
</div>

<div data-role="page" id="main" class="ui-body-e">
    <div data-role="content">   
        <li><a href="#login">Login</a></li>   
    </div>
</div>

---

Another option would be to try the method $.mobile.changePage() :

jQuery:

$(function() {
    $("#my_button").click(function() {
        $.mobile.changePage("#main", { transition: "slideup"});
    });
});

HTML:

<div data-role="page" id="login" class="ui-body-e">
    <div data-role="content">   
        <input type="button" id="my_button" value="ok"/>       
    </div>
</div>

<div data-role="page" id="main" class="ui-body-e">
    <div data-role="content">   
        <li><a href="#login">Login</a></li>   
    </div>
</div>

For more information about the method $.mobile.changePage() , check the doc online: http://jquerymobile.com/test/docs/api/methods.html

Hope this helps.