我有一個帶有多個復選框的簡單聯系表單，當用戶選擇一個復選框時，它應該轉到與值中的 url 綁定的 url/文件夾。當前的問題是，當用戶選中復選框并單擊“提交”，然后返回到該頁面并且復選框重置后，提交按鈕仍然會將他們帶到之前選擇的復選框。需要一種方法來完全重置表單并禁用按鈕，以便提交不會讓用戶感到太困惑。謝謝！這是我的表單代碼：<form name="frm" id="myForm" method="post" > <div class="provider-checkboxes"> <input type="checkbox" name="rGroup" id="r1" value="folder-1/" onclick="formaction(this)"/> <label class="check-div" for="r1">Label 1</label> <input type="checkbox" name="rGroup" id="r2" value="folder-2/" onclick="formaction(this)"/> <label class="check-div" for="r2">Label 2</label> <input type="checkbox" name="rGroup" id="r3" value="folder-3/" onclick="formaction(this)"/> <label class="check-div" for="r3">Label 3</label> <button type="submit" class="btn btn-primary btn-lg btn-block">Next</button> </div></form>這是腳本：$(document).ready(function(){ $('input[type="checkbox"]').click(function(){ var inputValue = $(this).attr("value"); $("." + inputValue).toggle(); });});$('[data-toggle="btns"] .btn').on('click', function(){ var $this = $(this); $this.parent().find('.active').removeClass('active'); $this.addClass('active');});$('.selectme input:checkbox').click(function() { $('.selectme input:checkbox').not(this).prop('checked', false);}); $('.provider-checkboxes input:checkbox').click(function() { $('.provider-checkboxes input:checkbox').not(this).prop('checked', false);}); function formaction(checkbox){ document.getElementById("myForm").action = checkbox.value;;}function UncheckAll(){ var w = document.getElementsByTagName('input'); for(var i = 0; i < w.length; i++){ if(w[i].type=='checkbox'){ w[i].checked = false; } }}
1 回答
SMILET
TA貢獻1796條經驗 獲得超4個贊
考慮以下代碼。根據您分享的內容，認為這會有所幫助。
$(function() {
function setFormAction(frm, a) {
frm.attr("action", a);
}
function unCheckAll() {
$("input[type='checkbox']").prop("checked", false);
$(".provider-checkboxes .btn").hide();
}
$('.provider-checkboxes input:checkbox').click(function() {
unCheckAll();
$(this).prop("checked", true);
$(".provider-checkboxes .btn").toggle(300);
setFormAction($("#myForm"), "./" + $(this).val());
console.log($("#myForm")[0]);
});
unCheckAll();
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form name="frm" id="myForm" method="post">
<div class="provider-checkboxes">
<input type="checkbox" name="rGroup" id="r1" value="folder-1/" />
<label class="check-div" for="r1">Label 1</label>
<input type="checkbox" name="rGroup" id="r2" value="folder-2/" />
<label class="check-div" for="r2">Label 2</label>
<input type="checkbox" name="rGroup" id="r3" value="folder-3/" />
<label class="check-div" for="r3">Label 3</label>
<button type="submit" class="btn btn-primary btn-lg btn-block">Next</button>
</div>
</form>
- 1 回答
- 0 關注
- 151 瀏覽
添加回答
舉報
0/150
提交
取消