Question

我已经看过大约20个或更多关于这个主题的帖子，但它们要么对我没有意义，要么略有不同。

我多年来一直在摸不着头脑。寻找答案提供了大量相互矛盾的建议，但我所看到的一切都没有用。我把问题归结为这个简单的形式。如果我在框中输入数据并单击按钮，则始终未定义警报。有人可以解释为什么请和我如何正确分配变量并通过在警报中将其推出来进行测试？

提前致谢。

代码如下：

<html>
<head>
    <script src="jquery-3.2.1.min.js"></script>
    <script>
        $(document).ready(function () {
            $("button").click(function () {
                var jsPostcode = document.getElementsByName("pcode").value;
                alert(jsPostcode);
            });
        });
    </script>
</head>

<body>
    <form name="login">
        <table>
            <td><input style="width: 80px" name="pcode" type="text" /></td>
            <td><button>OK</button></td>
        </table>
    </form>
</body>
</html>

Answer 1

由于您使用的是jQuery，因此您可以使用属性选择器$('[name=pbode]')来选择元素，然后使用.val()函数

来获取它的值

＆＃13;

$(document).ready(function() {
  $("button").click(function() {
    var jsPostcode = $("[name=pcode]").val();
    alert(jsPostcode);
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form name="login">
  <table>
    <td><input style="width: 80px" name="pcode" type="text" /></td>
    <td><button>OK</button></td>
  </table>
</form>

＆＃13;

Answer 2

document.getElementsByName返回数组。所以，更新这一行，

var jsPostcode = document.getElementsByName("pcode").value;

到

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

Answer 3

getElementsByName返回所有元素的集合。

您需要访问此集合的第一项。

为此，请将您的行更新为document.getElementsByName("pcode")[0].value。

它与您在js中访问数组的第一项的方式相同。

您需要将代码更新为以下内容。

$(document).ready(function() {
  $("button").click(function() {
    var jsPostcode = document.getElementsByName("pcode")[0].value;
    alert(jsPostcode);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form name="login">
  <table>
    <td>
      <input style="width: 80px" name="pcode" type="text" />
    </td>
    <td>
      <button>OK</button>
    </td>
  </table>
</form>

Answer 4

请参阅文档 - https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementsByName

elements = document.getElementsByName（name）
元素是一个实时NodeList集合 name 是元素的name属性的值。因此，我们正在访问数组中的第一项getElementsByName（“pcode”）[0]

$(document).ready(function() {
        $("button").click(function(){


var jsPostcode = document.getElementsByName("pcode")[0].value;

alert (jsPostcode);

});

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html><head>
</head>

<body>
                <form name="login">
                        <table>
                                <td><input style="width: 80px" name="pcode" type="text" /></td>
                                <td><button>OK</button></td>
                        </table>
                </form>
</body>
</html>

Answer 5

或者使用documentGetElementById();并为他们提供id以便更好地捕获。

JS文本变量始终显示未定义

5 个答案: