[object HTMLDivElement] 問題請教

jquery javascript

tenno081 2020-10-26 10:48:34 ‧ 1636 瀏覽

分享至

我有一些radiobutton 選項

<input checked="checked" id="PositionA_A001" name="PositionA" type="radio" value="A001"><label for="PositionA_A001">a</label>
<input id="PositionA_A002" name="PositionA" type="radio" value="A002">
<label for="PositionA_A002">b</label>
<input id="PositionA_A003" name="PositionA" type="radio" value="A003">
<label for="PositionA_A003">c</label>
<input id="PositionA_A004" name="PositionA" type="radio" value="A004">
<label for="PositionA_A004">d</label>
<input id="PositionA_A005" name="PositionA" type="radio" value="A005">
<label for="PositionA_A005">e</label>
<div class="html-helper-divsub" id="PositionA_A005_Block" style="display: none;"><input class="form-control" id="PositionOtherA" name="PositionOtherA" type="text" value=""></div>

我需要取他的值做一些字串相加的處理

 let PositionA = $("input[name='PositionA']:checked").val();

這邊console.log還是顯示他的value，可是我一但這樣做就會顯示[object HTMLDivElement]

let string = PostitionA + ....+...;

請問這是為什麼呢?我用其他的radiobutton都沒有此問題

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

3 個回答

Franky Chen

iT邦研究生 3 級 ‧ 2020-10-26 11:48:10

$("input[name='PositionA']:checked")是選取到所有checked的
你應該在後面加上index
例：$("input[name='PositionA']:checked")[0]
然後再加.val()
例：$("input[name='PositionA']:checked")[0].val()

回應 3
分享
檢舉

archer9080 iT邦研究生 3 級 ‧ 2020-10-26 11:55:46 檢舉

不好意思請教一下
一個容器裡面的radio不是只能單選?
還是我搞錯了甚麼

Franky Chen iT邦研究生 3 級 ‧ 2020-10-26 11:58:19 檢舉

對，只能單選，但$("input[name='PositionA']:checked")沒有說是他是radio，checkbox也能用這個，所以要附上index

附上code

<input checked="checked" id="PositionA_A001" name="PositionA" type="radio" value="A001"><label for="PositionA_A001">a</label>
    <input id="PositionA_A002" name="PositionA" type="radio" value="A002">
    <label for="PositionA_A002">b</label>
    <input id="PositionA_A003" name="PositionA" type="radio" value="A003">
    <label for="PositionA_A003">c</label>
    <input id="PositionA_A004" name="PositionA" type="radio" value="A004">
    <label for="PositionA_A004">d</label>
    <input id="PositionA_A005" name="PositionA" type="radio" value="A005">
    <label for="PositionA_A005">e</label>
    <div class="html-helper-divsub" id="PositionA_A005_Block" style="display: none;"><input class="form-control" id="PositionOtherA" name="PositionOtherA" type="text" value=""></div>
    <button onclick="log()">log</button>
    <script>
        function log() {
            alert(
                $("input[name='PositionA']:checked")[0].value
            );
        }
    </script>

archer9080 iT邦研究生 3 級 ‧ 2020-10-26 13:43:26 檢舉

登入發表回應

Homura

iT邦高手 1 級 ‧ 2020-10-26 13:43:29

你是不有其他Name一樣的元件啊?
我把你的程式碼複製貼上結果正確耶

回應
分享
檢舉

登入發表回應

rogeryao

iT邦超人 7 級 ‧ 2020-10-26 14:48:48

Html

<input checked="checked" id="PositionA_A001" name="PositionA" type="radio" value="A001"><label for="PositionA_A001">a</label>
<input id="PositionA_A002" name="PositionA" type="radio" value="A002">
<label for="PositionA_A002">b</label>
<input id="PositionA_A003" name="PositionA" type="radio" value="A003">
<label for="PositionA_A003">c</label>
<input id="PositionA_A004" name="PositionA" type="radio" value="A004">
<label for="PositionA_A004">d</label>
<input id="PositionA_A005" name="PositionA" type="radio" value="A005">
<label for="PositionA_A005">e</label>
<div class="html-helper-divsub" id="PositionA_A005_Block" style="display: none;"><input class="form-control" id="PositionOtherA" name="PositionOtherA" type="text" value=""></div>

<br>
<input type="button" value="Test" onclick="Test()">
<p id="TestValue"></p>

Javascript

function Test()
{
  let PositionA = $("input[name='PositionA']:checked").val();
  document.getElementById("TestValue").innerHTML=PositionA;
}

Demo
資料輸出時可能缺了 innerHTML

回應 1
分享
檢舉

tenno081 iT邦研究生 4 級 ‧ 2020-10-26 16:19:55 檢舉

我有看到這個可能性，但應該不太可能是我的
後來不知道為什蛇右眉此問題了@@

登入發表回應

我要發表回答

立即登入回答

參賽組數

1064 組

團體組數

40 組

累計文章數

22201 篇

完賽人數

602 人

15th鐵人賽 16th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽鐵人賽 2019鐵人賽 javascript 2018鐵人賽 python 2017鐵人賽 windows php c# windows server linux css react vue.js

IT邦幫忙