Question

很抱歉，如果这个初学者问题，但我有一些 jQuery 来隐藏SharePoint中的字段，但是现在我想要切换（隐藏/显示）用户单击按钮。我觉得我很接近，但无法正确理解语法。

我很确定这是$("input[toggleButton]).click(function()我搞砸了。任何想法都会很棒。

<style type="text/css">
#toggleButton {
margin-top:10px;
padding-right:20px;
text-align:right;
}
</style>

<br/>

<input type="button" class="toggleButton" value="Show/Hide All Fields" id="toggleButton">


<script>
$(document).ready(function()
{
$("input[toggleButton]).click(function()

{
$("nobr:contains('Approved By')").parent('h3').parent('td').parent('tr').toggle();
$("nobr:contains('Assigned To:')").parent('h3').parent('td').parent('tr').toggle();
$("nobr:contains('Request Status')").parent('h3').parent('td').parent('tr').toggle();
});
});

</script>

Answer 1

使用

$(".toggleButton").click(function(){
    ...
});

Answer 2

我在$（）中直接调用#toggleButton。

http://jsfiddle.net/agdm/fQhDh/1/

$(document).ready(function () {
  $('#toggleButton').click(function() {
    $("td:contains('Approved By')").parent().toggle();
    $("td:contains('Assigned To')").parent().toggle();
    $("td:contains('Request Status')").parent().toggle();
  });
});

另据：http://reference.sitepoint.com/html/nobr

“nobr元素在现代浏览器中有很好的支持（出于向后兼容的原因）但不应该使用。”

Answer 3

使用jQuery选择元素时，使用CSS选择器。使用元素名称和方括号时，您正在使用属性选择器。它看起来像这样：

$("a[title]"); // Select all <a> elements with the title attribute set to whatever value 
$("a[title=foobar]"); // Select all <a> elements with the title attribute set to "foobar"

您在标记中定义的按钮具有类名和ID集。因为通过类名选择可以返回多个元素，所以我会使用ID，因为它始终是唯一的。您可以使用“＃”按ID选择元素：

$("#id"); // Will return only one element

您可以使用“。”选择给定类的元素。像这样：

$(".className"); // Could return multiple elements

本文档解释了CSS中选择器的使用：http://www.w3.org/TR/CSS2/selector.html

我认为没有调用按钮单击事件的事件处理程序，因为选择器似乎是错误的。这个应该适合你：

$(document).ready(function() {

    $("#toggleButton").click(function() {
        // Do something
    });

});

如何在点击事件中切换jQuery中的按钮

3 个答案: