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)将通过变量的值 MaxAge传递给addClass，而不是字符串'MaxAge'。

此外，您确实应该使用 jQuery 来绑定事件处理程序而不是内联事件处理程序：

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

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

要了解有关事件处理程序的更多信息，我建议阅读quirksmode.org 上的文章。

还有其他问题，例如变量divinaddClass和global。不要忘记RemoveClassvar声明变量的时候。此外，函数的命名add与Remove.

MDN JavaScript 指南非常适合学习 JavaScript 基础知识。

于 2011-10-19T09:54:40.573 回答
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 回答
0

你永远不会实例化 div 变量。

尝试这个：

var div = "#" + id;
于 2011-10-19T10:03:41.357 回答