Jquery单选按钮显示和隐藏div

发布于 2024-12-18 03:40:49 字数 673 浏览 0 评论 0原文

我的 html 和 jquery 代码在这里。如果将显示以 123 结尾的值，则 jquery 代码将执行。但我在这里遇到了问题。在我单击值 c123 和 d123 并切换回 a 和 b 单选按钮后。显示的div不会消失。如何解决这个问题？

<input type="radio" value="a" />
<input type="radio" value="b" />
<input type="radio" value="c123" />
<input type="radio" value="d123" />



<ul id="localBankc123" class="localBank">
  <li>Maybank</li>
</ul>
<ul id="localBankd123" class="localBank">
<li>CIMB Bank</li>
</ul>

$(".localBank").hide();
$("input[value$='123']").click(function() {
 var bank = $(this).val();
        $(".localBank").hide();
        $("#localBank"+bank).show();
    });

原文

My html and jquery code here. The jquery code performs if value ending with 123 a specify div will show. But i got a problem here. After i clicked on value c123 and d123 and switch back to a and b radio buttons. The showed div will not disappear. How to fix this?

<input type="radio" value="a" />
<input type="radio" value="b" />
<input type="radio" value="c123" />
<input type="radio" value="d123" />



<ul id="localBankc123" class="localBank">
  <li>Maybank</li>
</ul>
<ul id="localBankd123" class="localBank">
<li>CIMB Bank</li>
</ul>

$(".localBank").hide();
$("input[value$='123']").click(function() {
 var bank = $(this).val();
        $(".localBank").hide();
        $("#localBank"+bank).show();
    });

分享到QQ

分享到微博

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

发布评论

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

り繁华旳梦境 2024-12-25 03:40:49

如果您发布带有 .localBank 内容的 HTML 部分，那就更好了。

但是，如果我正确理解了您的问题，它不会隐藏您的 div，因为处理程序不会被调用（input 没有以 123 结尾的值>确实）。

您可以将处理程序附加到所有 input，然后在处理程序内部，仅当单击的 input 具有以 123< 结尾的值时才显示 div /代码>。

像这样的东西：

$(".localBank").hide();
$("input").click(function() {
  var bank = $(this).val();
  $(".localBank").hide();
  if (bank.indexOf(/123$/) {
    $("#localBank"+bank).show();
  }
});

It would be better if you post the part of HTML with the .localBank stuff.

But, if I have understood your problem correctly, it won't hide your div because the handler doesn't get called (the input doesn't have a value ending with 123 indeed).

You can attach the handler to all of the inputs and then, inside the handler, show the div only if the clicked input has a value ending with 123.

Something like this:

$(".localBank").hide();
$("input").click(function() {
  var bank = $(this).val();
  $(".localBank").hide();
  if (bank.indexOf(/123$/) {
    $("#localBank"+bank).show();
  }
});

回复收藏 0 原文

谜兔 2024-12-25 03:40:49

$(".localBank").hide();
$("input").click(function() {
  var bank = $(this).val();
  if (bank.indexOf("123") > -1){
    $("#localBank"+bank).show();
  }else{
     $(".localBank").hide();
   }
});

$(".localBank").hide();
$("input").click(function() {
  var bank = $(this).val();
  if (bank.indexOf("123") > -1){
    $("#localBank"+bank).show();
  }else{
     $(".localBank").hide();
   }
});

回复收藏 0 原文

三五鸿雁 2024-12-25 03:40:49

请尝试这个代码..

$(".localBank").hide();
$("input").click(function() {
    var bank = $(this).val();
    $(".localBank").hide();
    $("#localBank"+bank).show();
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<input type="radio" name="bank" value="a" />
<input type="radio" name="bank" value="b" />
<input type="radio" name="bank" value="c123" />
<input type="radio" name="bank" value="d123" />
   

<ul id="localBankc123" class="localBank">
  <li>Maybank</li>
</ul>
<ul id="localBankd123" class="localBank">
<li>CIMB Bank</li>
</ul>

please try this code..

$(".localBank").hide();
$("input").click(function() {
    var bank = $(this).val();
    $(".localBank").hide();
    $("#localBank"+bank).show();
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<input type="radio" name="bank" value="a" />
<input type="radio" name="bank" value="b" />
<input type="radio" name="bank" value="c123" />
<input type="radio" name="bank" value="d123" />
   

<ul id="localBankc123" class="localBank">
  <li>Maybank</li>
</ul>
<ul id="localBankd123" class="localBank">
<li>CIMB Bank</li>
</ul>

回复收藏 0 原文

~没有更多了~