请原谅我提出这个问题,但我一直在试着解决这个问题,但我无法理解我搞砸了 . 我已经检查了很多关于SO的答案,建议在Jquery中使用attr或道具这对我不起作用,所以我想我可能会遇到其他一些问题 .
我有ruby代码,我有一个图标 . 当我点击这个图标时,我想显示/隐藏另一个div .
我的ROR代码:
<div class="choice <%= 'active' if listing.payment_term_shortterm == 'on' %>" data-toggle="wizard-checkbox">
<%= form.check_box :payment_term_shortterm, id: "payment_term_shortterm_test" %>
<div class="card card-checkboxes card-hover-effect">
<i class="ti-home"></i>
<p>Small Time</p>
</div>
</div>
以上内容在我的网站中创建了这个图标,如下所示:
我只是希望如果点击小时间它会显示另一个div . 到目前为止我的Jquery:
$(function () {
$("#payment_term_shortterm_test").click(function () {
if ($(this).is(":checked")) {
$("#SmallTimeShow").show();
} else {
$("#SmallTimeShow").hide();
}
});
});
这个jquery应该显示以下div:
<div id="SmallTimeShow" style="display: none;">
<div class="form-group">
<div class="row">
<div class="col-md-8 col-md-offset-1">
<p> Hi Loan for Small time.</p>
</div>
</div>
</div>
</div>
我尝试了很多东西,比如在jquery中使用props或attr,但它也没有用 .
编辑
这是浏览器检查元素中出现的内容:
1 回答
您可以尝试使用display'block'并显示'none',如下所述: