Question

我已经在SO上尝试了各种各样的东西，但是我无法让它发挥作用。下面是我的整个HTML测试文档。我用以下网址加载它：

file:///Users/aaronbratcher/Documents/Tester.html?Donor.firstName=John&Donor.lastNameBusiness=Smith

我期待的是，javascript会使用在URL上传递的值来填充2个文本字段，但是不会填充它们。日志消息表示按预期找到所有内容。没有报告错误或警告。

我做错了什么？

感谢。

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>Accept Donation</title>
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name = "viewport" content = "width = 320, initial-scale = 1, user-scalable = no">
    </head>

    <body>
    <form name="AcceptDonation" action="http://localhost" onsubmit="return review()" method="get">
        <H2>Donor Name</H2>
        <div class="table-field">
            <input type="text" class = "textField fullWidth" name = "Donor.firstName" id="firstName" autocorrect="off" placeholder="First Name">
        </div>
        <div class="table-field bottom">
            <input type="text" class="textField fullWidth" name = "Donor.lastNameBusiness" id="lastName" autocorrect="off" placeholder="Last Name">
        </div>
        </form>

        <script type='text/javascript'>
        var urlParameters = {}
        var kMinReceiptRequiredAmount = 250

         window.onload = function () {
            loadParameters()
        }

        function loadParameters() {
            var url = window.location.search.substring(1)
            var parts = url.split("&")
            for (var i=0; i < parts.length; i++) {
                var parameter = parts[i]
                var parameterParts = parameter.split("=")
                var parameterKey = decodeURI(parameterParts[0])
                var parameterValue = decodeURI(parameterParts[1])

                var docObject = document.getElementsByName(parameterKey)
                console.log(docObject)
                console.log(parameterValue)
                if (docObject) {
                    docObject.value = parameterValue
                }
            }           
        }
        </script>
    </body>
</html>

Answer 1

.getElementsByName()函数返回列表元素，即使页面上只有一个匹配。

  if (docObject && docObject.length)
    docObject[0].value = parameterValue;

你确实需要测试返回值是否为非空，因为.getElementsByName()总是返回NodeList。

  if (docObject.length)
    docObject[0].value = parameterValue;

Answer 2

您正在使用getElementsByName返回nodeList。因此，当您设置文本字段元素的值时，您需要从列表中访问它，就像在数组中一样。

var docObject = document.getElementsByName(parameterKey)
console.log(docObject)
console.log(parameterValue)
if (docObject.length) {
    docObject[0].value = parameterValue
}

如果可能，我会更改它，以便您按id而不是name查找元素。如果有多个具有该名称的字段，则使用getElementsByName非常有用。如果只有一个字段具有该ID，则使用getElementById非常有用，然后您不必担心使用nodeList

无法使用javascript分配值

2 个答案: