单选按钮值 returns 未定义
Radio button value returns undefined
这些按钮是可见的并且可以工作,但是当点击提交时它应该将选中的单选按钮(对于 3 组中的每一个)的值分配给一个变量,但是返回的值总是未定义的。
由于一组按钮,我希望输出是值或包含值的对象
severityFormValue.on("click", (e) => {
const loggedVia = $('input[name=loggedVia]:checked').val()
const allStable = $('input[name = allStable]:checked').val()
const EnvDown = $('input[name = EnvDown]:checked').val()
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="dropdown">
<button class="dropbtn" id="CCR_DACEbtn">CCR DACE ▼</button>
<div id="drowdownCCR_DACEID" class="dropdown-content">
Submitted by:
<input type="radio" name="loggedVia" value="phone" checked> phone
<input type="radio" name="loggedVia" value="email"> email<br>
All services stable?
<input type="radio" name="allStable" value="Yes"> Yes
<input type="radio" name="allStable" value="No" checked> No
<input type="radio" name="allStable" value="N/A"> N/A <br>
Environment Down?
<input type="radio" name="EnvDown" value="Yes"> Yes
<input type="radio" name="EnvDown" value="No" checked> No
<input type="radio" name="EnvDown" value="N/A"> N/A <br>
<button type="button" id="severityFormSubmit" >Submit</button>
</div>
</div>`
第二组无线电输入的名称是 AllStable
,而不是 allStable
,因此选择器不会找到它们,因为它是 case-sensitive。解决这个问题,您显示的代码可以正常工作:
var severityFormValue = $('#severityFormSubmit');
severityFormValue.on("click", (e) => {
const loggedVia = $('input[name="LoggedVia"]:checked').val()
const allStable = $('input[name="AllStable"]:checked').val();
const envDown = $('input[name="EnvDown"]:checked').val()
console.log(loggedVia);
console.log(allStable);
console.log(envDown);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="dropdown">
<button class="dropbtn" id="CCR_DACEbtn">CCR DACE ▼</button>
<div id="drowdownCCR_DACEID" class="dropdown-content">
Submitted by:
<input type="radio" name="LoggedVia" value="phone" checked> phone
<input type="radio" name="LoggedVia" value="email"> email<br>
All services stable?
<input type="radio" name="AllStable" value="Yes"> Yes
<input type="radio" name="AllStable" value="No" checked> No
<input type="radio" name="AllStable" value="N/A"> N/A <br>
Environment Down?
<input type="radio" name="EnvDown" value="Yes"> Yes
<input type="radio" name="EnvDown" value="No" checked> No
<input type="radio" name="EnvDown" value="N/A"> N/A <br>
<button type="button" id="severityFormSubmit">Submit</button>
</div>
</div>
另请注意,我将 EnvDown
变量名称更改为 envDown
并将 loggedVia
名称属性更改为 LoggedVia
以保持与其对应值的一致性。
这些按钮是可见的并且可以工作,但是当点击提交时它应该将选中的单选按钮(对于 3 组中的每一个)的值分配给一个变量,但是返回的值总是未定义的。
由于一组按钮,我希望输出是值或包含值的对象
severityFormValue.on("click", (e) => {
const loggedVia = $('input[name=loggedVia]:checked').val()
const allStable = $('input[name = allStable]:checked').val()
const EnvDown = $('input[name = EnvDown]:checked').val()
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="dropdown">
<button class="dropbtn" id="CCR_DACEbtn">CCR DACE ▼</button>
<div id="drowdownCCR_DACEID" class="dropdown-content">
Submitted by:
<input type="radio" name="loggedVia" value="phone" checked> phone
<input type="radio" name="loggedVia" value="email"> email<br>
All services stable?
<input type="radio" name="allStable" value="Yes"> Yes
<input type="radio" name="allStable" value="No" checked> No
<input type="radio" name="allStable" value="N/A"> N/A <br>
Environment Down?
<input type="radio" name="EnvDown" value="Yes"> Yes
<input type="radio" name="EnvDown" value="No" checked> No
<input type="radio" name="EnvDown" value="N/A"> N/A <br>
<button type="button" id="severityFormSubmit" >Submit</button>
</div>
</div>`
第二组无线电输入的名称是 AllStable
,而不是 allStable
,因此选择器不会找到它们,因为它是 case-sensitive。解决这个问题,您显示的代码可以正常工作:
var severityFormValue = $('#severityFormSubmit');
severityFormValue.on("click", (e) => {
const loggedVia = $('input[name="LoggedVia"]:checked').val()
const allStable = $('input[name="AllStable"]:checked').val();
const envDown = $('input[name="EnvDown"]:checked').val()
console.log(loggedVia);
console.log(allStable);
console.log(envDown);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="dropdown">
<button class="dropbtn" id="CCR_DACEbtn">CCR DACE ▼</button>
<div id="drowdownCCR_DACEID" class="dropdown-content">
Submitted by:
<input type="radio" name="LoggedVia" value="phone" checked> phone
<input type="radio" name="LoggedVia" value="email"> email<br>
All services stable?
<input type="radio" name="AllStable" value="Yes"> Yes
<input type="radio" name="AllStable" value="No" checked> No
<input type="radio" name="AllStable" value="N/A"> N/A <br>
Environment Down?
<input type="radio" name="EnvDown" value="Yes"> Yes
<input type="radio" name="EnvDown" value="No" checked> No
<input type="radio" name="EnvDown" value="N/A"> N/A <br>
<button type="button" id="severityFormSubmit">Submit</button>
</div>
</div>
另请注意,我将 EnvDown
变量名称更改为 envDown
并将 loggedVia
名称属性更改为 LoggedVia
以保持与其对应值的一致性。