Javascript 如何提醒输入值

How to alert input value

提问by Roko C. Buljan

So I recently decided to try learning app development with Intel XDK, and as of now I know only little bit of HTML.

所以我最近决定尝试使用英特尔 XDK 学习应用程序开发，到目前为止我只知道一点点 HTML。

I'm trying to create a basic test app that allows the user to type a message in a text box, and then click the submit button which gives an alert that displays the inputted text.

我正在尝试创建一个基本的测试应用程序，它允许用户在文本框中键入消息，然后单击提交按钮，该按钮提供显示输入文本的警报。

This is what I have:

这就是我所拥有的：

Message:
<br>
<input type="text" id="message" value="">
<br>
<button type="button" value="document.getElementByID(message)" onclick=alert(message)>Generate Text</button>

But when I run the app it displays [object HTMLInputElement].

但是当我运行该应用程序时，它会显示[object HTMLInputElement].

How can I fix this?

我怎样才能解决这个问题？

回答by Roko C. Buljan

to get an element value use

获取元素值使用

var message = document.getElementById("message").value;
alert( message );

Also, don't use inline JS. Rather assign an event handler

另外，不要使用内联JS。而是分配一个事件处理程序

document.getElementById("myButton").addEventListener("click", function() {

    var message = document.getElementById("message").value;
    alert( message );

}, false);

Here's a working example:

这是一个工作示例：

var message = document.getElementById("message");
document.getElementById("myButton").addEventListener("click", function() {
    console.log( message.value );
});

<br>
<input type="text" id="message" value="">
<br>
<button id="myButton" type="button">Generate Text</button>

回答by guest271314

But when I run the app it displays "[object HTMLInputElement]". How do I fix this?

但是当我运行应用程序时，它会显示“[object HTMLInputElement]”。我该如何解决？

messageat html, javascriptreferences element having id"message". You are calling alert()with DOMelement #messageas parameter. To correct this you can pass .valueproperty of #message: messageto alert(message.value).

message在html，javascript引用元素具有id"message"。您正在alert()使用DOM元素#message作为参数进行调用。要纠正此问题，您可以传递: to 的.value属性。#messagemessagealert(message.value)

Note, see Why don't we just use element IDs as identifiers in JavaScript?.

请注意，请参阅为什么我们不在 JavaScript 中仅使用元素 ID 作为标识符？.

You could alternatively attach a clickevent to buttonelement and call alert(document.getElementById("message"))within clickhandler, as demonstrated by @RokoC.Buljan solution.

您也可以将click事件附加到button元素并alert(document.getElementById("message"))在click处理程序中调用，如@RokoC.Buljan解决方案所示。

You are missing quotes around alert()at onclick, and .valueat message

您缺少alert()atonclick和.valueat周围的引号message

Message:
<br>
<input type="text" id="message" value="">
<br>
<button type="button" onclick="alert(message.value)">Generate Text</button>

回答by John Slegers

document.getElementByID(message)doesn't belong in the value attribute of your button, but should be inside your alert :

document.getElementByID(message)不属于您的按钮的 value 属性，但应该在您的警报内：

Message:
<br>
<input type="text" id="message" value="">
<br>
<button type="button" onclick="alert(document.getElementById('message').value)">Generate Text</button>

Note

笔记

It's generally recommended to separate your HTML code from your JavaSCript code and use Document.getElementById()instead of the HTML attribute onclickfor adding click events.

通常建议将您的 HTML 代码与您的 JavaSCRipt 代码分开，并使用Document.getElementById()代替 HTML 属性onclick来添加点击事件。

So, that means it's best to rewrite the code here-above like this :

所以，这意味着最好像这样重写上面的代码：

document.getElementById("button").addEventListener("click", function() {
   alert(document.getElementById('message').value);
});

Message:
<br>
<input type="text" id="message" value="">
<br>
<button type="button" id="button">Generate Text</button>

回答by Yasaman Ghassemi

You must use this function in alert and value just is a parameter that show as a button Try this instead:

您必须在警报中使用此函数，而 value 只是一个显示为按钮的参数 试试这个：

Message: 
<br> 
<input type="text" id="message" value=""> 
<br> 
<button type="button" value="show" onclick=alert(document.getElementByID('message'))>Generate Text</button>

回答by Nikola Stojakovi?

You need to type this in value parameter of button:

您需要在按钮的 value 参数中键入：

document.getElementById(message).value

Thanks for fixing me guys.

谢谢你们修理我。