0

選択リストがあり、それに基づいて、有効なオプションが選択されていない限りボタンを無効にしましたが、これは正常に機能しますが、フォームで「リセット」ボタンを押すと、「送信」ボタンは有効になりますが、無効にする必要があります(最初のオプションの値は "" であるため)。

どうすればこれを解決できますか?

ありがとう

jquery:

if ($("li#modFilterField_34 select").val() == "") {
        $('.search input[type="submit"]').attr('disabled','disabled');
    }


    $("li#modFilterField_34 select").change(function(){

        if ($(this).val() == "Paintings" ) {

            $('.search input[type="submit"]').removeAttr('disabled');


        } else if ($(this).val() == "Houses" ) {

           $('.search input[type="submit"]').removeAttr('disabled');

        } else {

            $('.search input[type="submit"]').attr('disabled','disabled');
        }
    });

html:

    <form id="modMtFilterForm0" name="modMtFilterForm0" method="get" action="/oljadir/index.php">

        <ul class="modMtFilter" id="modMtFilter0">
        <li class="mfieldtype_selectlist" id="modFilterField_34">
<label>Choose type*:</label>
<span class="filterinput"><select class="inputbox text_area" name="cf34">
<option value="">&nbsp;</option>
<option value="Paintings">Paintings</option>
<option value="Houses">Houses</option>
</select>
</span></li>

<li class="mfieldtype_corename" id="modFilterField_1"><label>Name:</label><span class="filterinput"><input type="text" size="50" id="filter_cf1" name="link_name" class="inputbox text_area"></span></li><li class="mfieldtype_mcheckbox" id="modFilterField_33"><label>Ostalo::</label><span class="filterinput"><ul style="margin:0;padding:0;list-style-type:none"><li><input type="checkbox" id="filter_cf33_0" value="KTV" name="cf33[]"><label for="filter_cf33_0">KTV</label></li><li><input type="checkbox" id="filter_cf33_1" value="Internet" name="cf33[]"><label for="filter_cf33_1">Internet</label></li><li><input type="checkbox" id="filter_cf33_2" value="Prevoz" name="cf33[]"><label for="filter_cf33_2">Prevoz</label></li></ul></span></li>        <li class="button-send"><input type="submit" onclick="javascript:var cookie = document.cookie.split(';');for(var i=0;i &lt; cookie.length;i++) {var c = cookie[i];while (c.charAt(0)==' '){c = c.substring(1,c.length);}var name = c.split('=')[0];if( name.substr(0,35) == 'com_mtree_mfields_searchFieldValue_'){document.cookie = name + '=;';}}" value="Search" disabled="disabled"></li>
    <button type="reset">Reset</button>


        </ul>

    </form>
4

3 に答える 3

2

必要なことは、要素resetにイベント ハンドラーをアタッチしform、必要に応じて要素を再度無効にすることです。このためには、あなたの HTML を確認する必要があります。または、一般的な例を示すだけでもかまいません。

編集：

ところで、このような場合は prop の代わりにpropattrを使用することをお勧めします。

すなわち

$('#modMtFilterForm0').on('reset', function() {
    $("li#modFilterField_34 select").val('');
    $('.search input[type="submit"]').prop('disabled', true);
});
于 2013-04-11T16:54:36.853 に答える
2

重複を減らすために関数に移動します。attr ではなく、prop の使用に注意してください。

function doDisableButton(){
    $('.search input[type="submit"]').prop('disabled', true);
}

値が空の場合は、行ったように呼び出します。 

if ($("li#modFilterField_34 select").val() == "") {
   doDisableButton();
}

リセットボタンがクリックされたときにも呼び出されます。 

$('.search input[type="reset"]').click(function(){
   doDisableButton();
});

それがコードを修正する方法です。個人的には、jQuery 検証またはフォーム送信で次のように処理します。

$("form").on("submit", function(){
    if ($("li#modFilterField_34 select").val() == "") {
        //alert user with a div, or even better use jQuery validation to handle this with a rule.
    }
});

その理由は、ユーザーがフォーム内のテキストボックス内でEnterキーを押すことで、フォームを送信できるためです。

これが役立つことを願っています。

于 2013-04-11T16:54:53.073 に答える