目前我有一个工作应用程序可以根据单击的按钮更改按钮的值。它是使用 javascript 编写的(在 script.js
中)。但是我想让它更好,所以我尝试改用 jQuery。但是,当我将 jQuery js 和 css 文件插入 index.html
时,按钮的值消失了,我不知道如何在不影响其功能的情况下将其完全更改为 jQuery。
这是原始 javascript 的一部分:(如果您想查看整个脚本,请告诉我)
ajax_status.onreadystatechange = function() {
if(ajax_status.readyState == 4 && ajax_status.status == 200) {
if(ajax_status.responseText == "ready_vid") {
document.getElementById("video_button").disabled = false;
document.getElementById("video_button").value = "record video start";
document.getElementById("video_button").onclick = function() {send_cmd("ca 1");};
document.getElementById("image_button").disabled = false;
document.getElementById("image_button").value = "record image";
document.getElementById("image_button").onclick = function() {send_cmd("im");};
document.getElementById("timelapse_button").disabled = false;
document.getElementById("timelapse_button").value = "timelapse start";
document.getElementById("timelapse_button").onclick = function() {send_cmd("tl " + (document.getElementById("tl_interval").value*10));};
document.getElementById("md_button").disabled = false;
document.getElementById("md_button").value = "motion detection start";
document.getElementById("md_button").onclick = function() {send_cmd("md 1");};
document.getElementById("halt_button").disabled = false;
document.getElementById("halt_button").value = "stop camera";
document.getElementById("halt_button").onclick = function() {send_cmd("ru 0");};
document.getElementById("mode_button").disabled = false;
document.getElementById("mode_button").value = "change mode to image";
document.getElementById("mode_button").onclick = function() {send_cmd("pm");};
halted = 0;
}
else if(ajax_status.responseText == "ready_img") {
document.getElementById("video_button").disabled = true;
document.getElementById("video_button").value = "record video start";
document.getElementById("video_button").onclick = function() {};
document.getElementById("image_button").disabled = false;
document.getElementById("image_button").value = "record image";
document.getElementById("image_button").onclick = function() {send_cmd("im");};
document.getElementById("timelapse_button").disabled = false;
document.getElementById("timelapse_button").value = "timelapse start";
document.getElementById("timelapse_button").onclick = function() {send_cmd("tl " + (document.getElementById("tl_interval").value*10));};
document.getElementById("md_button").disabled = true;
document.getElementById("md_button").value = "motion detection start";
document.getElementById("md_button").onclick = function() {};
document.getElementById("halt_button").disabled = false;
document.getElementById("halt_button").value = "stop camera";
document.getElementById("halt_button").onclick = function() {send_cmd("ru 0");};
document.getElementById("mode_button").disabled = false;
document.getElementById("mode_button").value = "change mode to video";
document.getElementById("mode_button").onclick = function() {send_cmd("vm");};
halted = 0;
}
index.html 中的 HTML:
<input id="video_button" type="button">
<!--<button data-role="none" id="video_button"></button>
<button class="ui-btn ui-btn-inline" id="image_button"></button> //this is wad i tried-->
<input id="image_button" type="button">
<input id="timelapse_button" type="button">
<input id="md_button" type="button"><br>
<input id="halt_button" type="button">
<input id="mode_button" type="button">
我在 index.html 中有一些其他的 jQuery 脚本。上面的 javascript 在另一个名为 script.js
的文件中。我的问题是,我是否还要在该 script.js 中插入 jQuery.js 的链接? $(document).ready(function()
怎么样?我也把它放在 script.js 里了吗?
最佳答案
对于最小的更改,您可以执行以下操作,
在标记中包含 jquery 库作为
<script type="text/javascript" src="static/jquery-1.10.2.min.js"></script>
将 document.getElementById('id') 替换为 $('#id')。
document.getElementById("video_button") => $('#video_button')
document.getElementById() 之后的任何东西在 jquery 中都变得有点不同
document.getElementById("video_button").disabled = false; $('#video_button').removeAttr('禁用');
document.getElementById("video_button").value = "录制视频开始"; $('#video_button').val('录制视频开始');
document.getElementById("image_button").onclick = function() {send_cmd("im");}; $('#image_button').click(function() {send_cmd("im");});
引用资料
关于javascript - 将 javascript 更改为 jquery 时按钮值消失,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22469186/