背景图像和切换类

发布于 2024-10-30 07:54:28 字数 989 浏览 0 评论 0原文

我有一个 TD 元素，它不会将其背景更改为图像。我正在使用 JQUERY 中的 ToggleClass。

这是我正在使用的两种不同的 CSS 样式：

.style22
  {
      height: 16px;
      width: 237px;
      background-image: url('../Images/Red-Error-Box.png');
      background-repeat: no-repeat;
  }
  .style23
  {
      height: 16px;
      width: 237px;
      background-image:none
  }

这是我用来切换类的函数，但它不会切换。：

<script type="text/javascript">
function validateText() {

  var emailEXP = /^([A-Za-z0-9_\+\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;

      if (!emailEXP.test(($("#tbEmail").val()))) {
          $('#EmailErrorMSG').toggleClass('style22');
          $('#EmailErrorMSG').show();
     }     

  }

  </script>

这是 HTML 标记：

 <tr>
    <td id="EmailErrorMSG" nowrap="nowrap" class="style23"></td>
 </tr>


<asp:Button ID="btnSignUp" runat="server" OnClientClick="validateText()"/>

感谢您的帮助。

原文

I have a TD element that won't change its background to an image. I'm using ToggleClass from JQUERY.

Here is the two different CSS styles that I'm using :

.style22
  {
      height: 16px;
      width: 237px;
      background-image: url('../Images/Red-Error-Box.png');
      background-repeat: no-repeat;
  }
  .style23
  {
      height: 16px;
      width: 237px;
      background-image:none
  }

Here is the function I'm using to toggle the class but it won't toggLe.:

<script type="text/javascript">
function validateText() {

  var emailEXP = /^([A-Za-z0-9_\+\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;

      if (!emailEXP.test(($("#tbEmail").val()))) {
          $('#EmailErrorMSG').toggleClass('style22');
          $('#EmailErrorMSG').show();
     }     

  }

  </script>

Here is the HTML markup:

 <tr>
    <td id="EmailErrorMSG" nowrap="nowrap" class="style23"></td>
 </tr>


<asp:Button ID="btnSignUp" runat="server" OnClientClick="validateText()"/>

Thanks for any help.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

记忆之渊 2024-11-06 07:54:29

您应该切换这两个类，以便任何时候只有一个适用。

$('#EmailErrorMSG').toggleClass('style22 style23');

You should toggle both classes so that only one applies at any time..

$('#EmailErrorMSG').toggleClass('style22 style23');

回复收藏 0 原文

云淡风轻 2024-11-06 07:54:29

风格 23：让它变得重要......
背景图像：无！重要的是

您不需要高度和宽度。

当您切换两个类都在该元素上时。

但如果你想做得更好，你可以创建不同的类：
创建一个仅具有高度和宽度的类

，以及一个具有图像设置的类。
然后只需切换第二类即可。

.style22
  {
      height: 16px;
      width: 237px;

  }
  .style23
  {
      background-image: url('../Images/Red-Error-Box.png');
      background-repeat: no-repeat;
  }

in style 23: just make it important...
background-image:none!important

you dont need the height and the width.

when you toggle both classes are on that element.

but if you want to do it even better you can create the classes diffrent:
create one class that has only the height and the width

and one class the has the image settings.
then just toggle the second class.

.style22
  {
      height: 16px;
      width: 237px;

  }
  .style23
  {
      background-image: url('../Images/Red-Error-Box.png');
      background-repeat: no-repeat;
  }

回复收藏 0 原文

~没有更多了~