Javascript,查看[对象HTMLInputElement]

时间:2013-03-13 11:16:51

标签: javascript html

我刚刚开始学习HTML。在我的一个变量上执行alert()会给我这个结果[object HTMLInputElement]

如何获取在文本字段中添加的数据,我的输入类型是文本?

6 个答案:

答案 0 :(得分:25)

如果元素是<input type="text">,则应查询value属性:

alert(element.value);

请参阅此jsFiddle中的示例。

此外,看到您开始学习HTML,您可能会考虑使用console.log()代替alert()进行调试。它不会中断脚本的执行流程,并且您可以使用开发人员工具在几乎每个浏览器中查看所有日志的一般视图(显然除了那个)。

当然,你可以考虑使用像Firebug这样的网络开发工具,这是一个强大的Firefox插件,提供了很多功能(调试javascript代码,DOM检查器,实时DOM / CSS更改,请求监控...)

答案 1 :(得分:22)

假设您的变量为myNode,您可以myNode.value来检索输入元素的值。

Firebug有一个“DOM”选项卡,显示有用的DOM属性。

另请参阅mozilla页面以获取参考:https://developer.mozilla.org/en-US/docs/DOM/HTMLInputElement

答案 2 :(得分:2)

变化:

$("input:text").change(function() {
    var value=$("input:text").val();
    alert(value);
});

$("input:text").change(function() {
    var value=$("input[type=text].selector").val();
    alert(value);
});

注意:选择器:id,类..

答案 3 :(得分:2)

不是因为您正在使用警报,而是在使用document.write()时也会发生。当您将您的ID或任何标签的类命名为与您在JavaScript代码中使用的任何变量相同时,通常会出现此问题。尝试通过更改javascript变量名称或更改标签的ID /类名称来进行操作。

我的代码示例: bank.html

<?php 

        if (have_posts()) :
        while (have_posts()) : the_post(); ?>



            <Script>

            $(document).ready(function removeFunction() {
            let post_id = '<?php global $post; echo $post->ID; ?>';
              var str = document.getElementById("link" + post_id).innerHTML; 
              var res = str.replace(/^(?:https?:\/\/)?(?:www\.)?/i, "").split('/')[0];
              document.getElementById("link" + post_id).innerHTML = res;

            });

           </Script>



<p><?php the_content(); ?></p>
<!-- This is where the URL's are EX: <a id="link[return_post_id]" href="http://example.com/">http://example.com/</a> -->



<?php endwhile;

    else :
    echo '<p>No content found</p>';

    endif;

?>

JavaScript代码: bank.js

<!doctype html>
<html>
<head>
    <title>Transaction Tracker</title>
    <script src="bank.js"></script> 
</head>
    <body>
        <div><button onclick="bitch()">Press me!</button></div>
    </body>
</html>

您可以看一下并从我的代码中了解概念。在这里,我在JS中使用了一个名为“ amt”的变量。您只是尝试运行我的代码。它将正常工作,但是当您在html正文中为div标签放置[id =“ amt”](不带方括号)(在JS代码中为变量名)时,您会看到与您所谈论的相同的错误。 如此简单的解决方案是更改变量名称或id或类名称。

答案 4 :(得分:1)

<input type="text" />
<script>
$("input:text").change(function() {
    var value=$("input:text").val();
    alert(value);
});
</script>

使用.val()获取元素的值(jquery方法),$(“input:text”)此选择器用于选择输入,.change()将事件处理程序绑定到“change”JavaScript事件

答案 5 :(得分:-1)

当您从客户端make获取值时,例如该值。

{{1}}