我有这段代码，在我选择单选按钮（通过点击标签是特定的）之后向我显示在data-target属性中定义的div，但我需要的是当我选择更改选项时另一个div需要消失..我已经尝试了很多东西，但没有一个有效..非常感谢
当我点击收音机Ano1时 - 出现div f4并且q2消失 当我点击收音机Ne1时 - div f4消失，q2出现..
它在另一个div上也是如此（你可以看到）..
$(document).ready(function() {
$('[data-target]').click(function() {
// $('.none').hide();
if ($(this).is(':hover')) {
var target = $(this).attr('data-target');
$(target).show(1000);
}
});
});
// `$('.none').hide();` is in comment because I want to see the choices..<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="q1" class="none">
<h3>Žádáte o nové číslo?</h3>
<input type="radio" name="novecislo" value="Ano1" id="Ano1"><label for="Ano1" data-target="#f4">Ano</label> <br>
<input type="radio" name="novecislo" value="Ne1" id="Ne1"><label for="Ne1" data-target="#q2">Ne</label>
</div>
<div id="q2" class="none">
<h3>Chcete převést číslo v rámci operátora T-mobile?</h3>
<input type="radio" name="op" id="Ano2"><label for="Ano2" data-target="#q3">Ano</label> <br>
<input type="radio" name="op" id="Ne2"><label for="Ne2" data-target="#f1,#f4">Ne</label> <br>
</div>
<div id="f4" class="none">
<h4>Jaký tarif chcete zvolit?</h4>
<input type="radio" name="tarif" value="tarif1" id="t1"><label for="t1" title="15Kč | bez dat | volání a sms 0,29/min">Profi na míru 1</label> <br>
<input type="radio" name="tarif" value="tarif2" id="t2"><label for="t2" title="190Kč | 1,5GB | volání a sms zdarma">Profi na míru 2</label> <br>
<input type="radio" name="tarif" value="tarif3" id="t3"><label for="t3" title="229Kč | 5GB | volání a sms zdarma">Profi na míru 3</label> <br>
<input type="radio" name="tarif" value="tarif5" id="t5"><label for="t5" title="149Kč | bez dat | volání a sms zdarma">Profi na míru 5</label> <br>
<h4>Co chcete aktivovat?</h4>
<input type="checkbox" name="akt" value="roaming" id="cc1"><label for="cc1">Roaming</label> <br>
<input type="checkbox" name="akt" value="platby" id="cc2"><label for="cc2">Platby</label>
<p></p>
<input type="button" name="send" value="ODESLAT" onclick="vypisForm();">
</div>
答案 0 :(得分：0)
你可以做一个简单的技巧：隐藏所有具有类none的div，然后才能使任何一个显示。像这样：
$(document).ready(function() {
$('[data-target]').click(function() {
// $('.none').hide();
if ($(this).is(':hover')) {
$('.none').hide();
var target = $(this).attr('data-target');
$(target).show(1000);
}
});
});
答案 1 :(得分：0)
尝试这个
$(document).ready(function() {
$("input:radio[name='novecislo']").change(function() {
var val = $(this).val();
if (val == 'Ano1') {
$('#f4').show();
$('#q2').hide();
} else {
$('#f4').hide();
$('#q2').show();
}
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="q1" class="none">
<h3>Žádáte o nové číslo?</h3>
<input type="radio" name="novecislo" value="Ano1" id="Ano1"><label for="Ano1" data-target="#f4">Ano</label> <br>
<input type="radio" name="novecislo" value="Ne1" id="Ne1"><label for="Ne1" data-target="#q2">Ne</label>
</div>
<div id="q2" class="none">
<h3>Chcete převést číslo v rámci operátora T-mobile?</h3>
<input type="radio" name="op" id="Ano2"><label for="Ano2" data-target="#q3">Ano</label> <br>
<input type="radio" name="op" id="Ne2"><label for="Ne2" data-target="#f1,#f4">Ne</label> <br>
</div>
<div id="f4" class="none">
<h4>Jaký tarif chcete zvolit?</h4>
<input type="radio" name="tarif" value="tarif1" id="t1"><label for="t1" title="15Kč | bez dat | volání a sms 0,29/min">Profi na míru 1</label> <br>
<input type="radio" name="tarif" value="tarif2" id="t2"><label for="t2" title="190Kč | 1,5GB | volání a sms zdarma">Profi na míru 2</label> <br>
<input type="radio" name="tarif" value="tarif3" id="t3"><label for="t3" title="229Kč | 5GB | volání a sms zdarma">Profi na míru 3</label> <br>
<input type="radio" name="tarif" value="tarif5" id="t5"><label for="t5" title="149Kč | bez dat | volání a sms zdarma">Profi na míru 5</label> <br>
<h4>Co chcete aktivovat?</h4>
<input type="checkbox" name="akt" value="roaming" id="cc1"><label for="cc1">Roaming</label> <br>
<input type="checkbox" name="akt" value="platby" id="cc2"><label for="cc2">Platby</label>
<p></p>
<input type="button" name="send" value="ODESLAT" onclick="vypisForm();">
</div>
答案 2 :(得分：0)
将data-target属性移动到收音机 此外，您无法同时点击和悬停
$(function() {
$('[data-target]').on("click", function() {
var target = $(this).attr('data-target');
console.log(target)
$(target).show(1000);
});
});#f4 {
display: none
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="q1" class="none">
<h3>Žádáte o nové číslo?</h3>
<input type="radio" name="novecislo" value="Ano1" data-target="#f4" id="Ano1"><label for="Ano1">Ano</label> <br>
<input type="radio" name="novecislo" value="Ne1" data-target="#q2" id="Ne1"><label for="Ne1">Ne</label>
</div>
<div id="q2" class="none">
<h3>Chcete převést číslo v rámci operátora T-mobile?</h3>
<input type="radio" name="op" data-target="#q3" id="Ano2"><label for="Ano2">Ano</label> <br>
<input type="radio" name="op" data-target="#f1,#f4" id="Ne2"><label for="Ne2">Ne</label> <br>
</div>
<div id="f4" class="none">
<h4>Jaký tarif chcete zvolit?</h4>
<input type="radio" name="tarif" value="tarif1" id="t1"><label for="t1" title="15Kč | bez dat | volání a sms 0,29/min">Profi na míru 1</label> <br>
<input type="radio" name="tarif" value="tarif2" id="t2"><label for="t2" title="190Kč | 1,5GB | volání a sms zdarma">Profi na míru 2</label> <br>
<input type="radio" name="tarif" value="tarif3" id="t3"><label for="t3" title="229Kč | 5GB | volání a sms zdarma">Profi na míru 3</label> <br>
<input type="radio" name="tarif" value="tarif5" id="t5"><label for="t5" title="149Kč | bez dat | volání a sms zdarma">Profi na míru 5</label> <br>
<h4>Co chcete aktivovat?</h4>
<input type="checkbox" name="akt" value="roaming" id="cc1"><label for="cc1">Roaming</label> <br>
<input type="checkbox" name="akt" value="platby" id="cc2"><label for="cc2">Platby</label>
<p></p>
<input type="button" name="send" value="ODESLAT" onclick="vypisForm();">
</div>
答案 3 :(得分：-1)
首先：使用.on('click', function(){})代替.click()