Question

document.getElementById（）。返回null的值下面是我的HTML代码

<div id="container">
<h1>dknfknf</h1>

<div id="innerContainer">
    <div style="height:auto;float:left;width:auto;">
        <input type="text"  id="wordone" value="plane" readonly/>
        <input type="radio" id="one"/>
    </div>
    <div style="height:auto;float:left;width:auto;margin-left:80px;">
        <input type="radio"  id="mOne" onclick="testIt();"/>
        <input style="width:400px;" type="text" id="meanmOne" value="state of tranquility,security and harmony" readonly/>
    </div>

</div>

<div id="innerContainer">
    <div style="height:auto;float:left;width:auto;">
        <input type="text" id="wordtwo" value="piece" readonly/>
        <input type="radio"  id="two"/>
    </div>
    <div style="height:auto;float:left;width:auto;margin-left:80px;">
        <input type="radio" id="mTwo" onclick="testIt();"/>
        <input style="width:400px;" type="text"  id="meanmTwo" value="a fraction or part of a whole" readonly/>
    </div>

</div>

<div id="innerContainer">
    <div style="height:auto;float:left;width:auto;">
        <input type="text"  id="wordthree" value="passed" readonly/>
        <input type="radio" id="three"/>
    </div>
    <div style="height:auto;float:left;width:auto;margin-left:80px;">
        <input type="radio" id="mThree" onclick="testIt();"/>
        <input style="width:400px;" type="text" name="meanmthree" value="a medieval soldier" readonly/>
    </div>

</div>
    </div>
    </body>

和js代码

function connect(div1, div2, color, thickness) {
var off1 = getOffset(div1);
var off2 = getOffset(div2);
// bottom right
var x1 = off1.left + off1.width - 1;
var y1 = off1.top + off1.height - 5;
// top right
var x2 = off2.left;
var y2 = off2.top + 5;
// distance
var length = Math.sqrt(((x2-x1) * (x2-x1)) + ((y2-y1) * (y2-y1)));
// center
var cx = ((x1 + x2) / 2) - (length / 2);
var cy = ((y1 + y2) / 2) - (thickness / 2);
// angle
var angle = Math.atan2((y1-y2),(x1-x2))*(180/Math.PI);
// make hr
var htmlLine = "<div style='border-radius:5px;padding:0px; margin:0px; height:" + thickness + "px; background-color:" + color + "; line-height:1px; position:absolute; left:" + cx + "px; top:" + cy + "px; width:" + length + "px; -moz-transform:rotate(" + angle + "deg); -webkit-transform:rotate(" + angle + "deg); -o-transform:rotate(" + angle + "deg); -ms-transform:rotate(" + angle + "deg); transform:rotate(" + angle + "deg);' />";
//
//alert(htmlLine);
div1.disabled = true;
div2.disabled = true;
document.body.innerHTML += htmlLine; 
}

function getOffset( el ) {
var _x = 0;
var _y = 0;
var _w = el.offsetWidth|0;
var _h = el.offsetHeight|0;
while( el && !isNaN( el.offsetLeft ) && !isNaN( el.offsetTop ) ) {
    _x += el.offsetLeft - el.scrollLeft;
    _y += el.offsetTop - el.scrollTop;
    el = el.offsetParent;
}
return { top: _y, left: _x, width: _w, height: _h };
}



window.testIt = function() {
var div1;
var div2;

if(document.getElementById('one').checked)
    {div1 = document.getElementById('one');}
else if(document.getElementById('two').checked)
    {div1 = document.getElementById('two');}
else if(document.getElementById('three').checked)
    {div1 = document.getElementById('three');}
else if(document.getElementById('four').checked)
    {div1 = document.getElementById('four');}
else if(document.getElementById('five').checked)
    {div1 = document.getElementById('five');}
else if(document.getElementById('six').checked)
    {div1 = document.getElementById('six');}
else if(document.getElementById('seven').checked)
    {div1 = document.getElementById('seven');}
else if(document.getElementById('eight').checked)
    {div1 = document.getElementById('eight');}
else if(document.getElementById('nine').checked)
    {div1 = document.getElementById('nine');}
else if(document.getElementById('ten').checked)
    {div1 = document.getElementById('ten');}

if(document.getElementById('mOne').checked)
    {div2 = document.getElementById('mOne');}
else if(document.getElementById('mTwo').checked)
    {div2 = document.getElementById('mTwo');}
else if(document.getElementById('mThree').checked)
    {div2 = document.getElementById('mThree');}
else if(document.getElementById('mFour').checked)
    {div2 = document.getElementById('mFour');}
else if(document.getElementById('mFive').checked)
    {div2 = document.getElementById('mFive');}
else if(document.getElementById('mSix').checked)
    {div2 = document.getElementById('mSix');}
else if(document.getElementById('mSeven').checked)
    {div2 = document.getElementById('mSeven');}
else if(document.getElementById('mEight').checked)
    {div2 = document.getElementById('mEight');}
else if(document.getElementById('mNine').checked)
    {div2 = document.getElementById('mNine');}
else if(document.getElementById('mTen').checked)
    {div2 = document.getElementById('mTen');}

div1_id = div1.id;
div2_id = div2.id;

check(div1_id,div2_id);
connect(div1, div2, "#000000", 2);


}

function check(div1,div2)
{
var left = div1;
var right = div2;

var temp1 = 'word'+left;
alert(temp1);
var word = document.getElementById('temp1').value;
//var mean = document.getElementById('mean'+'right').value;

alert(word);
 }

我在这一行得到了空 var word = document.getElementById（'temp1'）。value; 在检查功能可以有人帮助我吗？

Answer 1

你周围有额外的引号，你想引用变量，而不是字符串：

var word = document.getElementById(temp1).value;

从document.getElementById（）。value获取null

1 个答案: