【问题标题】:How to translate jQuery function into native javascript?如何将 jQuery 函数翻译成原生 javascript?
【发布时间】:2020-03-02 01:05:07
【问题描述】:

我的作业有问题。在我解释这个之前,我想为我的英语道歉。 所以,我尝试在 node.js 中进行聊天。我从网站“https://openclassrooms.com/fr/courses/1056721-des-applications-ultra-rapides-avec-node-js/1057959-tp-le-super-chat”中挑选了一个小代码。 它运作良好。聊天使用输入文本来发送消息。

我的问题是:这个聊天使用了一个 jQuery 库,而且它太旧了,我想将 jQuery 的函数翻译成原生 javascript。我已经成功翻译了其中的 3 个。一是还在抵抗。

$('#formulaire_chat').submit(function () {
    var message = $('#message').val();
    socket.emit('message', message); // Send the message to others clients
    insereMessage(pseudo, message); // Also post the message on our page
    $('#message').val('').focus(); // Empty the Chat area and put the focus back on
    return false; // Allows you to block the "classic" sending of the form
});

我试着把它变成这样:

document.getElementById('formulaire_chat').submit(function () {
    var message = document.getElementById('message').value;
    socket.emit('message', message); // Send the message to others clients
    insereMessage(pseudo, message); // Also post the message on our page
    document.getElementById('message').value = ' ';
    document.getElementById('message').focus();
    return false; // Allows you to block the "classic" sending of the form
});

当我使用“翻译”功能时,我收到错误“无法 POST /” 我尝试一根一根地操纵所有的线,以找到它阻塞的位置。 但是,尽管我工作了几个小时,但它还没有工作。 我正在学习代码,我是初学者,所以请不要评判我。

【问题讨论】:

  • 错误线是什么?
  • 是问题,我觉得是第一行的问题,其实我也不是很清楚。只是我的应用程序在没有该功能的情况下工作,所以我无法发送消息。但是一旦实现了我的代码,它就不起作用了。从第一行开始。我认为这是一个连锁问题,所以我尝试以这种方式探索。但没有成功

标签: javascript jquery node.js express socket.io


【解决方案1】:

您可以尝试 .addEventListener 或 .onsubmit() 或 (onsubmit="submitFunction()" on html of form tag)

document.getElementById('formulaire_chat').addEventListener('submit', function(evt){
    var message = document.getElementById('message').value;
    socket.emit('message', message); // Send the message to others clients
    insereMessage(pseudo, message); // Also post the message on our page
    document.getElementById('message').value = ' ';
    document.getElementById('message').focus();
    return false; // Allows you to block the "classic" sending of the form
});

【讨论】:

  • 好的,非常感谢,我尝试了你所有的解决方案,“.onsubmit()”和“.addEventListener('submit', function(evt)”正在工作。它仍然是一个问题之后这但它修复了一些错误。事实上,现在我可以在为消息提供的区域中看到消息“pop”。然后,在这之后的几毫秒,“cannot /POST”错误到来。所以我想我会继续努力但是非常感谢指出我的错误!
【解决方案2】:

不是 .submit() 而是 .onsubmit()

【讨论】:

  • 谢谢我没有看到这个错误,我是 javascript 的初学者,所以我没有所有的语法。经过数小时尝试在 jQuery 和本地语言之间建立链接,我没有看到“onsubmit()”语法。
  • 没关系,每个人都曾经是初学者!甚至两次:有很多有趣的东西要学! :-) 例如:我对 node.js 一无所知 Tu pourrais être mon professeur lol
  • 你知道吗:youmightnotneedjquery.com这个网站正是你所需要的!
  • 是的,我看了一下这个网站。当您需要使用 JS 原生并获得 jQuery 代码时,它会很有帮助。
猜你喜欢
  • 1970-01-01
  • 2017-02-25
  • 2011-04-23
  • 1970-01-01
  • 2017-07-24
  • 2018-09-12
  • 2013-07-17
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多