Ustawiłem następujący kod jQuery:
$('#check').change(function(){
if (this.checked){
$('#check').click(function() {
$("#rk").addClass('disabled', this.checked);
$("#rkBtn").removeClass('disabled', this.checked);
});
} else {
$("#rk").removeClass('disabled', this.checked);
$("#rkBtn").addClass('disabled', this.checked);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="field text-left">
<label class="text-left">Rk</label>
<input type="text" id="rk" class="rk" name="rk" placeholder="00.00.00 - 000.00" onkeyup="showHint(this.value,'rk')" />
</div>
<div class="field">
<input id="check" type="checkbox" name="checkbox"/>
<label class="title-checkbox">Tick this Checkbox.</label>
</div>
<div class="field">
<div class="col-lg-12 col-sm-12 col-xs-12" style="">
<a href="#" id="rkBtn" class="btn disabled"Next Step</a>
</div>
</div>
Próbuję osiągnąć, jest usunięcie lub dodanie klasy na kliknięcie pola wyboru. W tym samym czasie kliknięto pole wyboru, wyłączam pole wejściowe powyżej. Dość dziwnie działa, ale dopiero po tym, jak kliknąć pole wyboru w czasie czwartym.
Czy możesz pomóc?
2
maltesers
18 październik 2017, 15:14
2 odpowiedzi
Najlepsza odpowiedź
Ponieważ nie potrzebujesz użycia click
za pomocą funkcji change
w tym samym czasie. to wszystko.
$('#check').change(function(){
if (this.checked){
//$('#check').click(function() {
$("#rk").addClass('disabled', this.checked);
$("#rkBtn").removeClass('disabled', this.checked);
//});
} else {
$("#rk").removeClass('disabled', this.checked);
$("#rkBtn").addClass('disabled', this.checked);
}
});
.disabled {
opacity: .5;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="field text-left">
<label class="text-left">Rk</label>
<input type="text" id="rk" class="rk" name="rk" placeholder="00.00.00 - 000.00" onkeyup="showHint(this.value,'rk')" />
</div>
<div class="field">
<input id="check" type="checkbox" name="checkbox"/>
<label class="title-checkbox">Tick this Checkbox.</label>
</div>
<div class="field">
<div class="col-lg-12 col-sm-12 col-xs-12" style="">
<a href="#" id="rkBtn" class="btn disabled"Next Step</a>
</div>
</div>
-2
Pedram
18 październik 2017, 12:19
Po pierwsze, po prostu pozbyć się tego kliknięcia Wiązanie zdarzeń:
$(document).ready(() => {
$("#check").change(function() {
if (this.checked) {
$("#rk").addClass("disabled", this.checked);
$("#rkBtn").removeClass("disabled", this.checked);
} else {
$("#rk").removeClass("disabled", this.checked);
$("#rkBtn").addClass("disabled", this.checked);
}
});
});
Po drugie, tag kotwicy ma błąd składniowy
<a href="#" id="rkBtn" class="btn disabled"Next Step</a>
Powinien być
<a href="#" id="rkBtn" class="btn disabled">Next Step</a>
0
Pedram
14 styczeń 2018, 08:37