Question

我下面有一个html表单：

<label class="sr-only" for="phone">Phone Number </label>
<input type="text" name="phone" placeholder="eg. 123456XXXXXXXX" class="phone form-control" id="phone">
</div>
<div class="f1-buttons">
  <button type="button" class="btn btn-next">Next</button>
</div>

用户填写表单时，将在以下脚本中自动分配表单值：

<script>var data = "{ \"phone\":\"--this will get value from phone ID field\", \"tenantID\":\"0\" }"; .....</script>

尝试使用document.getElementById("phone").value;，但是它不起作用。有没有建议如何实现这一目标？

						
            var data = "{ \"MSISDN\":\"document.getElementById("phone").value\", \"tenantID\":\"0\" }";
								var xhr = new XMLHttpRequest();
								xhr.withCredentials = true;

								xhr.addEventListener("readystatechange", function () {
								  if (this.readyState === 4) {
									console.log(this.responseText);
								  }
								});

								xhr.open("POST", "https://api/v1/uat/user");
								xhr.setRequestHeader("accept", "application/json;charset=UTF8");
								xhr.setRequestHeader("content-type", "application/json");
								xhr.setRequestHeader("api-key", "12345565");
								xhr.setRequestHeader("cache-control", "no-cache");
								xhr.send(data);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<fieldset>
  <h4>Please fill phone Number:</h4>
  <div class="form-group">
    <label class="sr-only" for="phone">Phone Number (123456789xxx) </label>
<input type="text" name="phone" placeholder="eg. 123456789xxx" class="MSISDN form-control" id="phone">
</div>
<div class="f1-buttons">
<button type="button" class="btn btn-next">Next</button>
</div>
</fieldset>

我编辑了问题，电话号码字段是在正文请求中使用post方法调用API响应。我想做的是，当用户填写电话号码时，将张贴到API URL以获取响应，如果有效，则响应将以下一种形式打印

谢谢

Answer 1

var data = "{ \"MSISDN\":\"document.getElementById("phone").value\", \"tenantID\":\"0\" }";

在字符串文字中放入一些JavaScript源代码只会使字符串文字包含该源代码，而不是执行它的结果。

手工生成JSON并不是一个好主意。该值可能包含会破坏它的特殊字符。

创建一个对象。向该对象添加一个值。然后使用库函数对其进行编码。

var data = {
    MSISDN: document.getElementById("phone").value,
    tenantID: "0"
};
var json = JSON.stringify(data);

Answer 2

您正在将JSON分配到变量var data = "{ \"phone\":\"--this will get value from phone ID field\", \"tenantID\":\"0\" }"中。因此，您可以直接访问data，如以下代码片段所示：

console.log(data)

<script>var data = "{ \"phone\":\"--this will get value from phone ID field\", \"tenantID\":\"0\" }"</script>

在JavaScript中将表单值分配给var

2 个答案: