为什么 Jquery $(#); 不工作，但 Javascript document.getElementById 工作正常吗？
[英]Why Jquery $(#); doesn't work but Javascript document.getElementById works fine?
问题描述
I have a set of fully functioning codes in Javascript with "document.getElementById".
我在 Javascript 中有一组功能齐全的代码，带有“document.getElementById”。 But when I change it to Jquery, it doesn't work (and there are no errors).但是当我将其更改为 Jquery 时，它不起作用（并且没有错误）。
<!DOCTYPE html>
<html>
<head>
<style></style>
<script src="jquery-3.3.1.min.js"></script>
<script language="javascript">
function formChk(){
var success=true;
var types = ["Western","Chinese","Local","Beverage"];
var nameTxtBox=$("#name"); <!--This doesn't work-->
var picturesTxtBox=document.getElementById("pictures"); <!--This works fine-->
The corresponding id="name" and id="pictures" are in the codes below:对应的 id="name" 和 id="pictures" 代码如下：
<p><input type="text" id="name" name="name"></p>
<p><input type="text" id="pictures" name="pictures"></p>
There are no error messages in the console.控制台中没有错误消息。 However, the code doesn't run as per it's supposed to.但是，代码没有按预期运行。 This entire code is supposed to perform a form validation check - if the user input is left empty, it should throw an error message.整个代码应该执行表单验证检查 - 如果用户输入为空，它应该抛出错误消息。 However, when I change the "getElementById" to JQuery $(#);, the form validation doesn't work.但是，当我将“getElementById”更改为 JQuery $(#); 时，表单验证不起作用。
Why does this happen??为什么会出现这种情况？？ Isn't $(#);不是 $(#); the exact equivalent of document.getElementById?完全等同于 document.getElementById？
4 个解决方案
解决方案1
4 2019-02-01 11:34:12
Isn't $(#);不是 $(#); the exact equivalent of document.getElementById?完全等同于 document.getElementById？
Absolutely not, they return very different elements, jQuery returns a绝对不是，它们返回非常不同的元素， jQuery返回一个
collection of matched elements either found in the DOM based on passed argument(s) or created by passing an HTML string.
Jquery() documentation Jquery() 文档
While document.getElementById() returns虽然document.getElementById()返回
An Element object describing the DOM element object matching the specified ID, or null if no matching element was found in the document.
document.getElementById() documentation document.getElementById() 文档
If for compatibility with your previous code you have to access the Element object from the jQuery collection, you can use the array notation.如果为了与之前的代码兼容，必须从 jQuery 集合访问 Element 对象，则可以使用数组表示法。
So if the selector matches a single element, like an id, you can do所以如果选择器匹配单个元素，比如一个 id，你可以这样做
let el = $('#selector')[0];
To mimic the behaviour of document.getElementById() .模仿document.getElementById()的行为。
解决方案2
1 已采纳 2019-02-01 11:28:22
$("#name") return a jQuery object not an Element object like document.getElementById("pictures"); $("#name")返回一个 jQuery 对象而不是一个 Element 对象，如document.getElementById("pictures"); to return a Element object you need to get the Element object from the jQuery object要返回一个 Element 对象，您需要从 jQuery 对象中获取 Element 对象
$("#name")[0]
解决方案3
0 2019-02-01 11:24:41
如果你想获得#name 的值，那就是
$("#name").val()
解决方案4
0 2020-03-06 10:30:09
$('#fileUpload').val('');
我们必须在 val() 中传递值。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.