действие кнопки с помощью jQuery Mobile, - PullRequest
Новая
       25

действие кнопки с помощью jQuery Mobile,

0 голосов
/ 24 августа 2011

Возникли проблемы с динамическим построением кнопки с помощью jQuery Mobile. Скопируйте и запустите. Смотрите примечания в коде. 

<!DOCTYPE html>
<html>
  <head>
    <title>MSC Pre-Close Application</title>
    <meta charset="utf-8"/>

    <!-- standard Jquery/jQuery Mobile Libraries -->
    <script src="jquery.mobile/jquery.js"></script>
    <script src="jquery.mobile/jquery.mobile.js"></script>
    <link rel="stylesheet" href="jquery.mobile/jquery.mobile.css" />


<BR/>
<div data-role="page" id="mainmenu">
    <div data-role="header" data-position="inline">
    <h1>Main Menu</h1>
    </div>
    <div class="ui-body ui-body-c">
    <div data-role="content">   

        <div class="ui-block-a"><button id="click_me" type="submit" data-theme="a" data-icon="home">Click me to change the button to my right</button></div>
        <div class="ui-block-a"><button class="cl_pre_phone1" type="submit" rel="external" data-theme="a" data-icon="home">Primary Phone</button></div>

<script>
$(document).ready(function()
{
    // this changes the label but not the href action.
    $(".cl_pre_phone1").html("<a href='google.com'> Google</a>");

    $("#click_me").click(function() {
        alert("this should change the text and href of the button!");
        // here I would like to change the value as well as the href action, but it does not work.
        $(".cl_pre_phone1").html("<a href='yahoo.com'>Yahoo</a>");
        //$(".cl_pre_phone1").append("<a href='yahoo.com'>Yahoo</a>");
        //$(".cl_pre_phone1").append("<a href='yahoo.com'>Yahoo</a>").reload(true);

    });         
});

</script>

1 Ответ

0 голосов
/ 24 августа 2011

Вы получаете беспорядок из-за улучшения, которое делает jQM. Ваша кнопка переписывается на: 

<span class="ui-btn-inner ui-btn-corner-all"><span class="ui-btn-text">Primary Phone</span>
<span class="ui-icon ui-icon-home ui-icon-shadow"></span></span>
<button class="cl_pre_phone1 ui-btn-hidden" type="submit" data-theme="a" data-icon="home"  aria-disabled="false">Primary Phone</button>

Одним из способов решения этой проблемы было бы изменить вызов внутри обратного вызова на: 

$(".cl_pre_phone1").attr("href", "http://yahoo.com").parent().find(".ui-btn-text").text("Yahoo");

или вы можете заменить весь ui-block-a div.

...