2

jQuery の addClass と removeClass をフォーム選択環境で動作させようとしていますが、ほとんど成功していません。

親 div のクラスを変更したいのですが、関数で ID を渡そうとしましたが、私の試みはすべて無駄でした。任意の指示と支援をいただければ幸いです。

<div id="MaxAge" class="SearchFormStyle">
                <select name="maxage" onchange="addClass(MaxAge);">
                    <option value="0">Age</option>
                    <option value="1" >1 Year Old</option>
                    <option value="2" >2 Years Old</option>
                </select>
                    <span class="ThisValue">
                        <a href="#" onclick="RemoveClass(MaxAge)">VALUE ENTERED HERE</a>
                    </span>
                </div>

<script>
    function addClass (id) { 
        div = "#" + id; 
        $(div).addClass("InputSet"); 
    }
    function RemoveClass (id) { 
        div = "#" + id; 
        $(div).removeClass("InputSet"); 
    }
</script>
4

3 に答える 3

3

addClass(MaxAge)文字列ではなく、変数の値をに 渡します。MaxAgeaddClass'MaxAge'

さらに、インライン イベント ハンドラーの代わりに、jQuery を使用してイベント ハンドラーをバインドする必要があります。

$("select[name='maxage']").change(function() {
    addClass('MaxAge');
});

$('.ThisValue a').click(function(event) {
    RemoveClass('MaxAge');
    event.preventDefault();
});

イベント ハンドラーの詳細については、quirksmode.org の記事を読むことをお勧めします。

div変数 inaddClassやglobalRemoveClassであるなど、他の問題もあります。変数を宣言するときを忘れないでください。また、関数の命名には一貫性がありません。varaddRemove

MDN JavaScript ガイドは、JavaScript の基本を学ぶのに非常に適しています。

于 2011-10-19T09:54:40.573 に答える
0

div 変数をインスタンス化することはありません。

これを試して：

var div = "#" + id;
于 2011-10-19T10:03:41.357 に答える
0

あなたはほとんど正しい方法でそれをやっています。これが私がすることです（あなたへのコメント付き）

// onchange event of the selectbox with id = maxage
$("#maxage").change(function() {
    $("#MaxAge").addClass("InputSet");
});

// the click event for the a element within span with class ThisValue
$("span.ThisValue a").click(function(e) {
    // prevent doing default behaviour like going to another location...
    e.preventDefault();
    $("#MaxAge").removeClass("InputSet");
});
于 2011-10-19T09:56:56.890 に答える