[英]passing variables to function with jquery
尽管我确实使用PHP,但是我是javascript新手。
我在href的onclick事件上使用javascript / jquery传递变量时遇到问题。
我正在从远程URL提取json数据,每个请求都需要3个参数。
日期,价格和货币。
我有一个构建URL的功能,如下所示:
function getIndexData(date, price, currency){
ajaxURL = "/data/"+date+"/"+price+"/"+currency+"";
}
这可以很好地工作并构建我需要的URL。
但是,我在页面上有一个jQuery datepicker,可以将日期更改为所需的日期,如下所示:
$(function () {
$("#datepicker").datepicker(
{
dateFormat: 'yymmdd',
onSelect: function (date) {
getIndexData(date, price, currency )
}
}
);
});
即使先前已设置价格和货币,现在也未定义它们。
我的onclick事件存在相同的问题-如果我尝试使用以下方式发送价格或货币:
<a href="javascript:void(0);" onclick="getIndexData('date','price','currency')">NET</a></span>
价格和货币未定义。
有什么办法可以仅将一个变量发送到函数中,同时保留已经存在的值?
很抱歉,这是一个非常基本的问题。 我对此还很陌生,很显然我在此过程中误解了一些东西。
好的,所以这是更新的答案。 如您所见,如果在代码的全局范围中声明了变量,那么日期选择器函数将可以访问它。 我认为它以前没有用,因为html是错误的。 我删除了所有html,只包含了日期选择器,如果在浏览器中对其进行测试,您会看到在控制台中价格,货币变量在日期选择器的onSelect函数中可用,您还可以在其中执行函数getIndexData 。 我已经将该函数分配给了一个变量,这样您就可以使用变量getIndexData来使用该函数。
<html>
<head>
<script
src="https://code.jquery.com/jquery-3.2.1.min.js"
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
crossorigin="anonymous"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<body>
<div class="col-sm-5 index-grid">
<span class="grid-label">Price</span>
<span class="btn btn-grid"><a href="javascript:void(0);" onclick="getIndexData(indexDate, indexCurrency ,indexPrice);">CLOSE</a></span>
<span class="btn btn-grid"><a href="javascript:void(0);" onclick="getIndexData(indexDate, indexCurrency ,indexPrice);">RETURN</a></span>
<span class="btn btn-grid"><a href="javascript:void(0);" onclick="getIndexData(indexDate, indexCurrency ,indexPrice);">NET</a></span>
</div>
<p>Date: <input type="text" id="datepicker"></p>
</body>
</html>
<script>
var ajaxURL;
var indexDate = "2017-08-20"
var indexPrice = "closeprice";
var indexCurrency = "EUR";
var getIndexData = function (indexDate, indexCurrency, indexPrice) {
ajaxURL = "/data/" + indexDate + "/" + indexPrice + "/" + indexCurrency + "";
alert(ajaxURL);
}
$(document).ready(function() {
$(function() {
$("#datepicker").datepicker({
dateFormat: 'yymmdd',
onSelect: function(date) {
console.log(date);
console.log(indexPrice);
console.log(indexCurrency);
console.log(getIndexData);
}
});
});
});
</script>
如果您在以下之外声明了价格和货币:
$(function () {
$("#datepicker").datepicker(
{
dateFormat: 'yymmdd',
onSelect: function (date) {
getIndexData(date, price, currency )
}
}
);
});
然后,您需要使用“ this”关键字来访问价格和货币值。 就像下面的例子一样。 您可能还需要检查此链接以获取更多信息: https : //javascriptplayground.com/blog/2012/04/javascript-variable-scope-this/
$(function () {
$("#datepicker").datepicker(
{
dateFormat: 'yymmdd',
onSelect: function (date) {
getIndexData(date, this.price, this.currency )
}
}
);
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.