gpt4 book ai didi

javascript - 尝试将此范围滑动条添加到 .hta 文件时出现错误 "$ is undefined"

转载 作者:行者123 更新时间:2023-11-27 23:40:57 25 4
gpt4 key购买 nike

以下 codepen 链接显示了一个简单的范围 slider ,我想在我的 .hta 文件中使用它。

Codepen Link

问题是目前当我运行 .hta 文件时出现“$ is undefined error”,然后当我单击“Yes”继续时,它只显示:

screenshot

我认为可能是因为jQuery库没有加载,所以我补充说:

<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>

但这只会延迟 hta 大约 30 秒,然后显示相同的错误。

这是范围 slider 的脚本:

var range = $('.input-range'),
value = $('.range-value');

value.html(range.attr('value'));
range.on('input', function(){
value.html(this.value);
});

这是我的 .HTA 代码。非常感谢您的帮助:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta charset="UTF-8">
<title>Adjustments</title>


<script type="text/vbscript" language="vbscript">

Sub window_onload()
window.resizeTo 338,545
End Sub

</SCRIPT>
<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>

<HTA:APPLICATION icon="C:\Users\ME\Desktop\Abacus\compIcon.ico"
APPLICATIONNAME="WELCOME"
SCROLL="no"
SINGLEINSTANCE="no"
WINDOWSTATE="normal"
MinimizeButton="yes"
MaximizeButton="no"
RESIZE="no"
CAPTION="no"
>

<script type='text/javascript'>
$(document).ready(function() {
var range = $('.input-range'),
value = $('.range-value');

value.html(range.attr('value'));

range.on('input', function(){
value.html(this.value);
});
});
</script>


<style>

* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

body {
font-family: sans-serif;
padding: 40px;
}

.range-slider {

// Slider
.input-range {
-webkit-appearance: none;
width: 300px;
height: 10px;
border-radius: 5px;
background: #ccc;
outline: none;

// Slider Handle
&::-webkit-slider-thumb {
-webkit-appearance: none;
width: 20px;
height: 20px;
border-radius: 50%;
background: #353535;
cursor: pointer;
-webkit-transition: background .15s ease-in-out;
transition: background .15s ease-in-out;

&:hover {
background: #e06161;
}
}

&:active::-webkit-slider-thumb {
background: #e06161;
}

&::-moz-range-thumb {
width:20px;
height: 20px;
border: 0;
border-radius: 50%;
background: #353535;
cursor: pointer;
-webkit-transition: background .15s ease-in-out;
transition: background .15s ease-in-out;

&:hover {
background: #e06161;
}
}

&:active::-moz-range-thumb {
background: #e06161;
}
}

// Tooltip Tag
.range-value {
display: inline-block;
position: relative;
width: 80px;
color: #fff;
font-size: 16px;
line-height: 20px;
text-align: center;
border-radius: 3px;
background: #353535;
padding: 5px 10px;
margin-left: 7px;

&:after {
position: absolute;
top: 8px;
left: -7px;
width: 0;
height: 0;
border-top: 7px solid transparent;
border-right: 7px solid #353535;
border-bottom: 7px solid transparent;
content: '';
}
}
}

// Firefox Overrides
::-moz-range-track {
background: #ccc;
border: 0;
}

input::-moz-focus-inner {
border: 0;
}

</style>




</head>

<body>

<div class="range-slider">
<input class="input-range" type="range" value="0" min="-75000" step="500" max="75000">
<span class="range-value"></span>
</div>

</body>
</html>

最佳答案

//code.jquery.com/jquery-1.9.1.min.js 是一个协议(protocol)相关的 URL。然而,HTA 既不是 HTTP 也不是 HTTPs 资源。观察网络请求(使用Fiddler之类的工具)会显示jQuery脚本下载失败。

改为使用 http://code.jquery.com/jquery-1.9.1.min.js 作为 jQuery 源。

关于javascript - 尝试将此范围滑动条添加到 .hta 文件时出现错误 "$ is undefined",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31778339/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com