javascript - 将对象传递给函数但无法识别

标签 javascript jquery

我的代码

<html>

<head>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script type="text/javascript">
        function process(e) {

            alert("Hello! I am an alert box1!!");
            e.hide();
        };

        $(document).ready(function() {

            var p = $("#id1"); //jquery object  
            p.click(function() {
                process(this); //line A
            });
        });
    </script>
</head>

<body>
    <p id=id1>If you click on me, I will disappear.</p>
</body>

</html> 

点击文字不消失,控制台报错:

TypeError: e.hide is not a function

但是如果我将 A 行代码更改为如下

<html>

<head>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script type="text/javascript">
        function process(e) {

            alert("Hello! I am an alert box1!!");
            e.hide();
        };

        $(document).ready(function() {

            var p = $("#id1"); //jquery object  
            p.click(function() {
                process(p); //change this to p, Line A
            });

        });
    </script>
</head>

<body>
    <p id=id1>If you click on me, I will disappear.</p>
</body>

</html>

它有效!!!

我也尝试了代码:

<html>

<head>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script type="text/javascript">
        function process(e) {

            alert("Hello! I am an alert box1!!");
            e.style.visibility = "hidden";
        };

        $(document).ready(function() {

            var p = $("#id1")[0]; //jquery object to dom object
            p.addEventListener("click", function() {
                process(this);
            });

        });
    </script>
</head>

<body>
    <p id=id1>If you click on me, I will disappear.</p>
</body>

</html>

它也有效。

欢迎评论

最佳答案

您可以使用console.log()查看javascript如何处理您发送的内容.

正在做console.log(this)在日志中给出这个:

<p id="id1">If you click on me, I will disappear.</p>

您可以看到的是普通的 DOM 对象。

但是,做console.log(p)在日志中给出这个:

[p#id1, context: document, selector: "#id1"]

它代表一个可以操作的 jQuery 对象。如果您希望 jQuery 为您从 this 中提取对象,将您发送的内容包装在 jQuery 中:

function process(e){

    alert("Hello! I am an alert box1!!");
    $(e).hide(); // Wrap to convert DOM object.
};

$(document).ready(function(){

    var p =$("#id1");//jquery object  
    p.click(function(){
         process(this);//change this to p, Line A
    });


});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p id=id1>If you click on me, I will disappear.</p>

关于javascript - 将对象传递给函数但无法识别,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31412389/

相关文章:

javascript - 保留行号的自定义 console.log

javascript - 有没有在 Firefox 浏览器中检测 Windows-11 和 Windows-10 的方法?

javascript - Jasmine 并导入自定义 Node 模块

javascript - 我如何从 jquery 中的 html 表中提取从时间到时间(约会时间)

javascript - 如何在wordpress小部件中将表格宽度设置为父div宽度

javascript - 如何将具有相同键的一组对象组合成一个对象?

javascript - 两个变量声明之间的区别

javascript - 在 onclick 处理程序中修改目标 url

javascript - 输入字段值何时等于 '' 、 null 或 undefined

javascript - 让图像在变换后填充容器(90deg)