5

私は以下を使用するボタンのセットを持っていますjquery mobile

<fieldset data-role="controlgroup" data-type="horizontal" data-mini="true" style="text-align:center">
    <input id="radio1" name="" value="site" type="radio">
    <label for="radio1">
        Site
    </label>
    <input id="radio2" name="" value="transmitter" type="radio">
    <label for="radio2">
        Transmitter
    </label>
    <input id="radio3" name="" value=" channel" type="radio">
    <label for="radio3">
        Channel
    </label>
</fieldset>

そして、クリック時にポップアップを表示するか、クリックをキャッチして手動で表示する必要があります。問題は、jquery mobileこのコンテンツを単独でレンダリングすることです。それで、それは可能ですか?

4

6 に答える 6

7

jQuery Mobileは新しいボタンスタイルを作成するため、クリックイベントはボタンのふりをしてspan要素にバインドする必要があります。フィールドセットにはIDまたはその他の識別子を指定する必要があります。ボタン要素にアクセスするために使用します。

クリックイベントは、アクティブなcssプロパティ表示があるため、元のラジオ要素にバインドできません。

実例は次のとおりです:http://jsfiddle.net/Gajotres/dCEnC/

$(document).on('pagebeforeshow', '#index', function(){       
    $('#custom-fieldset').find('.ui-btn').on('click', function(){      
        $('#popupBasic').popup('open');
    });    
});
于 2013-03-13T15:31:59.603 に答える
1

ラジオボタンに名前を付けてから、基本的なjQueryをいくつか入力します。

$('input[name="myRadioName"].click(function() {
    alert('You clicked' + $(this).val());
}

もちろん、document.readyでラップしてください。

于 2013-03-13T14:04:33.987 に答える
1

試す:

$( document ).on( "vclick", "input:radio", function() {
    console.log("click");
});
于 2013-03-13T14:08:04.593 に答える
1

JqueryMobile 1.4.1

すべての解決策から、これを除いて、私には何も機能しませんでした:

$('#myFieldset').find('[type="radio"]').on('click', function( event ){    

        console.log("Yes");

        if ($(this).attr("id") == "radio-choice-h-2a") { // do something... } 
        else { // do something else...}

    });

ここ#myFieldsetで、はフィールドセット#radio-choice-h-2aのIDであり、イベントをトリガーしているラジオボタンのIDです。

于 2014-02-28T09:19:13.773 に答える
0

私はあなたの問題を解決しました

私のフィドルを見てください

http://jsfiddle.net/nikhilagrawal60/hB4CF/

<a href="#popupBasic" data-role="button" data-rel="popup">Reject & SMS</a>
<div data-role="popup" id="popupBasic" data-theme="c" class="ui-corner-all">
    <form>
        <div style="padding: 10px 20px;">
                <h3>Please enter reason</h3>

            <label for="un" class="ui-hidden-accessible">Reason:</label>
            <textarea cols="40" rows="8" name="textarea" id="un" data-theme="c" placeholder="Reason"></textarea>
            <button type="submit" data-theme="c">Ok.</button>
        </div>
    </form>
</div>
于 2013-03-13T14:13:12.607 に答える
0
<fieldset data-role="controlgroup" data-type="horizontal" id="custom-fieldset">            
        <label for="utilPlayBtn">Record</label>
        <input type="radio" name="rbtn" id="utilPlayBtn" value="rb1" checked="checked"/>
        <label for="utilRecordBtn">Play</label>
        <input type="radio" name="rbtn" id="utilRecordBtn" value="rb2"/>
</fieldset>  

$('#custom-fieldset').click(function() {                                          
    if ($("#utilPlayBtn").is(":checked")) {
       alert("PlayChecked");
    }else{
       alert("PlayNotChecked");
    }
});
于 2016-01-11T18:40:45.487 に答える