0

私はこの作業のほとんどを持っています。選択したラジオボタンに応じて表示されるdivを切り替えようとしていますが、これは機能します。さらに、可視性に応じて非表示の入力 (name=martygeocoderlatlngonly) の無効な属性を切り替えていますが、これも機能します。

ただし、最初に表示された入力 (name=martygeocoderlatlngonly) を読み取り専用から無効に切り替え、焦点を合わせたり外したりするのに苦労しています。

HTML:

 <p>Modify:
    <label>
        <input id="rdb1" type="radio" name="toggler" value="1" checked />Location</label>
    <label>
        <input id="rdb2" type="radio" name="toggler" value="2" />Lat/Lng</label>
</p>
<div id="blk-1" class="toHide" style="">
    <p>
        <label for="martygeocoderaddress">Address</label>
        <br />
        <input class="widefat" type="text" name="martygeocoderaddress" id="martygeocoderaddress" value="" size="30" />
    </p>
    <p>
        <label for="martygeocoderlatlng">Lat/Lng</label>
        <br />
        <input class="widefat" type="text" name="martygeocoderlatlng" id="martygeocoderlatlng" value="" size="30" readonly />
    </p>
</div>
<div id="blk-2" class="toHide" style="display:none;">
    <p>
        <label for="martygeocoderlatlng">Lat/Lng</label>
        <br />
        <input class="widefat" type="text" name="martygeocoderlatlngonly" id="martygeocoderlatlng" value="" size="30" disabled/>
    </p>
</div>

Jクエリ:

// Toggle display of fields
$("[name=toggler]").click(function () {
    //$('.toHide').hide();
    $("#blk-" + $(this).val()).each(function () {
        //$(this).show();
    });
    $(":input[name='martygeocoderlatlngonly']").each(function () {
        this.disabled = !this.disabled;
    });
    $(":input[name='martygeocoderlatlng']").each(function () {
        if (this.readOnly = true) {
            this.readOnly = false;
            this.disabled = true;
        } else {
            this.readOnly = true;
            this.disabled = false;
        }
    });
});

以前はphpを使用して開発していましたが、oopには入ったことがないので、jqueryとjavascriptに少し夢中になっています。

#

解決:

$("[name=toggler]").click(function () {
    $('.toHide').hide();
    $("#blk-" + $(this).val()).each(function () {
        $(this).show();
    });
    $(":input[name='martygeocoderlatlngonly']").each(function () {
        this.disabled = !this.disabled;
    });
    $(":input[name='martygeocoderlatlng']").each(function () {
        this.readOnly = !this.readOnly;
        this.disabled = !this.disabled;
    });
});
4

2 に答える 2