jQuery将文本内容隐藏在标签中，而不是标签本身 [英] jquery hide text content in a tag, not the tag itself

问题描述

我有一个使用这个html语法的滑块：

 < div id =theatre> 
< a class =sliderImghref =01.jpg/>一些文字< / a> 
< a class =sliderImghref =02.jpg/>另一个描述< / a> 
< a class =sliderImghref =03.jpg/>无论< / a> 
< a class =sliderImghref =04.jpg/>无论< / a> 
< / div> 
  

我需要做的是隐藏a标签的文本，而不是a标签本身。 / p>

我得到了这个但不起作用。

  var imgCaptions = $（＃theater a.sliderImg）。html（）; 
 $（imgCaptions）.hide（）; 
  

我无法添加跨度，因为我使用某些AJAX的内容。结构必须保持。

非常感谢您的帮助。圣诞快乐！

解决方案

我建议：

  a.sliderImg {
 color：transparent; 
} 
  

您也可以使用 user-select code> CSS属性以防止文本被选中：



  a.sliderImg {
 color：transparent; 
 -webkit-touch-callout：none; 
 -webkit-user-select：none; 
 -khtml-user-select：none; 
 -moz-user-select：none; 
 -ms-user-select：none; 
 -o-user-select：none; 
 user-select：none; 
} 
  

或者，可能使用取消选择属性：



 < a unselectable =onclass =sliderImghref = 04.jpg>凡是< / A> 
  

顺便说一句，您的HTML格式不正确， / 如果 不在开始标记中（仅在void元素的开始标记中，例如 input 或 img ）。

参考文献：

• user-select 。

I have a slider using this html syntax:

<div id="theatre">
    <a class="sliderImg" href="01.jpg" />some-text</a>
    <a class="sliderImg" href="02.jpg" />another-description</a>
    <a class="sliderImg" href="03.jpg" />whatever</a>
    <a class="sliderImg" href="04.jpg" />whatever</a>
</div>

What I need to do is to hide the text of the a tags not the a tags themselves.

I got this but doesn't work.

var imgCaptions = $("#theatre a.sliderImg").html();
$(imgCaptions).hide();

I can't add a span because I use the content for some AJAX. The structure has to remain.

Many thanks for your help. Merry Xmas!

解决方案

I'd suggest:

a.sliderImg {
    color: transparent;
}

You could also use the user-select CSS property to prevent the text being selected:

a.sliderImg {
    color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

Or, possibly, use the unselectable attribute on the elements themselves:

<a unselectable="on" class="sliderImg" href="04.jpg">whatever</a>

Incidentally your HTML is malformed, the / should not be in the opening tag (that's only in the opening tag for void elements, such as input or img).

References:

• user-select.

这篇关于jQuery将文本内容隐藏在标签中，而不是标签本身的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！