jQuery document.ready不会触发，jQuery无法正常工作

Question

我在这里查看了其他一些类似的问题，并尝试了以下操作：

1. 将所有$更改为jQuery
2. 确保我使用正确的src
3. 使用jQuery.noConflict（）

我正在尝试从html文件中的SQLite3数据库（工作正常）访问数据。

<script src="jquery-3.3.1.min.js" type="text/javascript"></script>

<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(){console.log("HELLO");}
</script>

无论放置在哪里，我都不会收到控制台消息！ 看来我的jQuery都不起作用。

这是我尝试访问数据的地方：

<div class="panel-body">
  The website you're most active on:
  <select onchange="dropdown(this)">
  <option value='PastHour'>Past Hour</option>
  <option value='Past2Hours'>Past 2 Hours</option>
  <option value='PastDay'>Past 24 Hours</option>
</select><br><br>


<script type="text/javascript">

 if()
  <b>Most Frequently Visited:</b><div id="most-freq"></div>
  <b>Second Most Frequently Visited:</b><div id="most-freq-2"></div>

</div>

function dropdown(that) {

  const requestURL = 'data/' + that.value;
  jQuery.ajax ({
    url: requestURL,
    type: 'GET',
    dataType: 'json',
    success: (data) => {
    console.log('data:', data);
    console.log(data.Most);
    console.log(data.SecMost);
    jQuery('#most-freq').html(data.Most);
    jQuery('#most-freq-2').html(data.SecMost);
}

})

}
</script>

我可以访问localhost / data并获取想要查看的数据，因此我相信.js文件中的app.get函数是可以的。

除了未显示数据或未将其打印到控制台之外，我还收到错误消息，即未定义下拉列表。 我认为这是因为范围，我该如何更改？

Answer 1

您的代码应为：

jQuery(document).ready(function () {console.log("HELLO");});

代替：

jQuery(document).ready(){console.log("HELLO");}

它不会引发任何错误日志，因为没有错误。 使用正确的缩进，很容易看到差异：

正确的行为：

jQuery(document).ready(function () {
    console.log("HELLO");
});

错误的行为：

jQuery(document).ready();
{
    console.log("HELLO");
}

Answer 2

从JQuery ready的文档链接

当DOM完全加载时，JQuery有三种执行javascript代码的方法。 这些是：

• $（处理程序）
• $（document）.ready（处理程序）
• $（“ document”）.ready（handler）

例：

$(function(){ do something ... });

要么

$(document).ready(function(){ do something .... });

Answer 3

您的代码 function（）是必需的。 它指定了在文档加载后要运行的功能

jQuery(document).ready(){console.log("HELLO");}

如果您仍然遇到问题，请尝试以下操作：

参考：来自 https://learn.jquery.com/using-jquery-core/document-ready/的 代码

$( document ).ready(function() {
    console.log( "ready!" );
});

Answer 4

jQuery并非用于调试目的。 您可以在发生某些情况时实例化控制台。

$('#buttonTest').click(function() {
  console.log('you click on buttonTest');
  // do something
});

由于某些原因，控制台对象可能不可用。 然后，您可以检查它是否有用-这很有用，因为在部署到生产环境时不必删除调试代码：

if (window.console && window.console.log) {
  // console is available
}

我建议使用val与这种方法：

<select id="mySelect" onchange="myFunction($(this).val());">
<option value="testVaue">Ford F150<option>
</select>
function myfunction(mySelect){alert("my val from select: "+mySelect );}