JavaScript jQuery隐藏/显示功能

所以最近我一直在研究js的一点点。JavaScript jQuery隐藏/显示功能

所以，基本上，我的问题是，我需要隐藏参数中传递的任何内容，或者如果它已经隐藏，则显示它。

这里是我的代码：

<script type='text/javascript'> 
<!-- 
function toggleReport(table){ 
//the table argument is the table's id 
alert(table);     //to check that the name of the table is right 
if($('#table').is(':visible')){ //check if visible 
    $('#table').hide();  //if so, hide it 
    alert('hide');   //send a message that it is now being hidden 
}else{       //if already hidden 
alert('show');     //send a message that it is now being shown 
$('#table').show();    //show the table 
} 

} 
//--> 
</script>

但是，它不工作....它发送警报，一切是正确的，但是，它并不隐藏或显示表.. ..

但是，如果我尝试这样做：

<script type='text/javascript'> 
<!-- 
function toggleReport(){ 
//removed the argument 
alert('table_1'); 
if($('#table_1').is(':visible')){ 
    $('#table_1').hide(); 
    alert('hide'); 
}else{ 
alert('show'); 
$('#table_1').show(); 
} 

} 
//--> 
</script>

它的工作原理！为什么这样？因为即时通讯将在网站上有很多表格和其他需要隐藏和显示的内容，我不想为每个表格创建新功能..：/

请帮帮我！

谢谢！

来源

2012-05-25 Baruch

非常简单的应用切换（）这一翻译秀（）/隐藏（），切换（）使元素可见，如果它是隐藏和掩饰它是否可见。

<script type='text/javascript'>; 
function toggleReport(element_ID){ 
$("#"+element_ID).toggle(); 
} 
</script>

如果你想下面的硬编码的元素ID不是使用脚本

<script type='text/javascript'> 
function toggleReport(){ 
$("#table_1").toggle(); 
} 
</script>

干杯，并且不要忘了投我的答案 :)

来源

2012-05-25 05:26:33 IuR

谢谢！你的工作实际上并不复杂！ – Baruch

如果你正在传递一个元素的引用，用它作为你的选择：

function toggleReport(table){ 
    $(table).toggle(); 
}

注意我使用.toggle()，这将做你尝试手动做什么。如果你想登录新的状态，您可以在回调这么做：

function toggleReport(table) { 
    $(table).toggle('fast', function(){ 
     console.log("Element is visible? " + $(this).is(":visible")); 
    }); 
}

请注意，如果您要传递的元素的ID，你的选择将需要修改：

$("#" + table).toggle();

来源

2012-05-25 05:18:10 Sampson

谢谢，但我在切换参数中传递什么？我的表是来自我在css中创建的一个名为'hidden'的类，并且显示在那里等于none，现在如何使用切换来切换它的开启和关闭？对不起，如果我的问题听起来很愚蠢..我很新的js .. – Baruch

@Baruch jQuery将为你处理 - 不要担心CSS。只需调用'$（table）.toggle（）'，其中'table'是元素的引用。 – Sampson

@Baruch在这里提供的示例中，您应该传递对您希望显示/隐藏的DOM元素的引用。它可以是“原始”或已经选定的jQuery对象。 – jatrim

There's a prebuilt Jquery function for this.

来源

2012-05-25 05:18:52 Norse

可以使用toggle函数来实现这个....

$(selector).toggle();

来源

2012-05-25 05:19:55

演示http://jsfiddle.net/uW3cN/2/

演示与参数传递http://jsfiddle.net/uW3cN/3/

良好的读取API切换：http://api.jquery.com/toggle/

代码

function toggleReport(){ 
//removed the argument 
$('#table_1').toggle(); 

}

另一个样本其余的HTML是在这里http://jsfiddle.net/uW3cN/3/

function toggleReport(tableid){ 
//removed the argument 
$('#'+tableid).toggle(); 

}

来源

2012-05-25 05:24:11

你犯的错误你原来的功能是你实际上并没有使用你传递给你函数的参数。你选择了"#table"这就是简单的在页面上选择一个id为“table”的元素。它根本没有引用你的变量。

如果您的意图是将ID传入选择器应写入jQuery("#" + table)。如果table是一个DOM元素的引用，那么你会写jQuery(table)（没有引号和井号）。

来源

2012-05-25 06:12:54 jatrim

JavaScript jQuery隐藏/显示功能

回答

相关问题