javascript - 如何在用锚 javascript 包裹的 div 中输出我的值

Question

我正在尝试将我的值输出到包裹在锚点中的 div 中。基本上有人输入他想要的高度，它给了他等效的数据表。

我无法弄清楚如何在包含在锚点中的 div 中输出我想要的字符串。

这是我的代码：

<form name="test">
<label for="height">Height</label>
    <input type="text" name="height" /><br>
    <label for="width">Width</label>
<input type="text" name="width" /><br>
<label for="depth">Depth</label>
<input type="text" name="depth" /><br>
<label for="load">Load</label>
<input type="text" name="load" /><br>
    <input type="button" onclick="calculate();" value="Calculate" /><br><br>



</form>
<div id="result">
</div>

            <script type="text/javascript">
                        function calculate()
                        {
                            var height = document.test.height.value;
                            if (height <= 525) {
                                var str = "Download your Datasheet 1";

                            }
                            else if (height < 645) {
                                var str = "Datasheet 2";

                            }

                            else if (height > 1265) {
                                var str = "This configuration is beyond the standard range of top-load testers. Please contact Mecmesin Sales to discuss ways to meet your requirements.";
                            }

                            else if (isNaN(height)) {
                              window.alert(height + ' is not a number!');
                              }

                            else {
                                var str = "Datasheet 3";
                            }
                            document.test.result.value = str.anchor();

                        }
            </script>

提前致谢。

Answer 1

您没有正确使用 DOM。

您需要为height输入提供一个 ID：

<input type="text" id="height" name="height" />

var height = document.getElementById("height").value;

---

或者你可以简单地使用：

var height = document.getElementsByName("height")[0].value;

但我不建议这样做。

Answer 2

尝试这个：

document.getElementById("result").innerHTML = str;

Answer 3

var height = document.test.height.value

这条线没有给你表格中的高度值。

给那个输入一个像'height'这样的id，然后得到它的值，如下所示：

var height = document.getElementById('height').value;

您无法像尝试那样将元素作为文档对象的属性访问，您需要使用 document.getElementById 或 document.getElementByTagName 之类的东西来选择它们

Answer 4

我认为其他人错过了让 div 包含锚点的要点......这表明您需要提供一个 url 以及一个字符串，但是一旦您完成了替换文档的附加代码。 test.result.value行应该类似于：

// empty out the result div first
var node = document.getElementById('result');
while(node.firstChild) {
    node.removeChild(node.firstChild);
}

// create the anchor DOM object
var a = document.createElement('a');
var linkText = document.createTextNode(str);
a.appendChild(linkText);
a.title = str;
a.href = "http://example.com/"+str+".pdf"; //for example

// attach it to your result node
node.appendChild(a);

如果您不打算在不刷新页面的情况下重用页面，则可以不使用 while 循环。