Jquery在单击时更改文本到"；“显示”；或；隐藏“；

在此脚本中，单击“显示”链接并显示预览图像时，链接文本应更改为“隐藏”。它仅在第三次单击后工作

<span id='previewLinks'><br/><a id='showPreview' title='".get_option('my_theme')."'>Show</a>

$('#showPreview').click
(
    function(e) 
    {
    var myImage = $('#my_theme :selected').val();
    $('#largePreview').slideToggle(0, function() {
        $('#showPreview').text($(this).is(':visible') ? 'Hide' : 'Show');
    });
    $('#largePreview').attr('src', '<?php echo get_bloginfo('template_directory') ?>/styles/'+myImage+'/screenshot-help.jpg');
    }
);

显示
$（“#显示预览”）。单击
(
职能（e）
{
var myImage=$（“#我的_主题：选定”）.val（）；
$（“#大预览”）。滑动切换（0，函数（）{
$（'#showPreview'）.text（$（this）.is（':visible'）？'Hide'：'Show'）；
});
$（'largePreview'）.attr（'src'，'/styles/'+myImage+'/screenshot help.jpg'）；
}
);

它最初不起作用的原因是

#largePreview

必须具有与您假设的相反的显示状态。这个改变可能会解决它。注意

$('#showPreview').text(!$(this).is(':visible') ? 'Hide' : 'Show');

或者您可能需要更改
#largePreview
的css。您可以尝试以下操作：

$('#showPreview').click(
    function(e) {
    var myImage = $('#my_theme :selected').val();
    $('#largePreview').slideToggle(0, function() {
        $('#showPreview').text($(this).is(':visible') ? 'Hide' : 'Show');
    });
    $('#largePreview').attr('src', '<?php echo get_bloginfo('template_directory') ?>/styles/'+myImage+'/screenshot-help.jpg');
    }).click();

$（'showPreview'）。单击(
职能（e）{
var myImage=$（“#我的_主题：选定”）.val（）；
$（“#大预览”）。滑动切换（0，函数（）{
$（'#showPreview'）.text（$（this）.is（':visible'）？'Hide'：'Show'）；
});
$（'largePreview'）.attr（'src'，'/styles/'+myImage+'/screenshot help.jpg'）；
})。单击（）；
只要找出你做错了什么：




1.使用

二,
将为您提供一个正确的定位点


希望有帮助！
也多亏了贾斯珀。
最初是显示还是隐藏
#大预览
的？你为什么要使用持续时间为零的
滑动切换
，而不是
隐藏（）
？这有点违反直觉，不是吗<代码>如果隐藏，则输出“隐藏”

，

如果可见，则输出“显示”

@Jasper-是的，几天前我回答了一个类似的问题，用户实际上希望这样。我很困惑，但我想有些人是这样看的。@Scott B我在这里添加了一个首字母

click（）

$（this）。过滤器（“：visible”）

总是返回true，所以文本总是设置为“Hide”。使用

.is（）

而不是

.filter（）

将返回

true

/

false

：

$（此）.is（“：可见”）

。在向下筛选到仅可见元素之后，还可以检查jQuery对象的

length

属性：

$（this.filter（“：visible”）.length>0

。以下是您的JSFIDLE的更新版本：

$(document).ready(function(){
});