我在javascript中有这个
$(document).ready(function () {
$(".terms").hide();
$("#Options").change(function () {
var optionId = $(this).val();
if (optionId == 0) {
$(".options").hide();
}
else {
var option = $(this).find(":selected").text();
option = option.split(' ').join('_')
$(".options").find("#options_link").attr("href", "Options/+option+.html")
$(".options").show();
}
});
});
基本上我想在页面读取和.change选项
上调用此方法我如何将此功能拆分为自己的功能?我很困惑的主要部分是如何将$(this)传递给我将创建的新函数
更新
我现在正在使用此代码
$(document).ready(function () {
$(".terms").hide();
$("#Options").change(updateOptions); // onchange
$.proxy(updateOptions, $('#Options'))(); // onload
});
function updateOptions() {
var optionId = $(this).val();
if (optionId == 0) {
$(".options").hide();
}
else {
var option = $(this).find(":selected").text();
option = option.split(' ').join('_')
$(".options").find("#options_link").attr("href", "Options/" + option + ".html")
$(".options").show();
}
});
但基本上我想在页面加载时调用它。我不能使用UpdateOptions(),因为(这个)什么都没有?
答案 0 :(得分:3)
您只需要将逻辑分离到一个函数并在相关事件下调用它。试试这个:
$(document).ready(function () {
$(".terms").hide();
$("#Options").change(updateOptions); // onchange
$.proxy(updateOptions, $('#Options'))(); // onload
});
function updateOptions() {
var optionId = $(this).val();
if (optionId == 0) {
$(".options").hide();
}
else {
var option = $(this).find(":selected").text();
option = option.split(' ').join('_')
$(".options").find("#options_link").attr("href", "Options/" + option + ".html")
$(".options").show();
}
});
请注意,我使用$.proxy
来维护函数中this
的范围。我还修复了我认为应该是option
变量的字符串连接。
答案 1 :(得分:0)
您可以在定义change()
处理程序后立即调用onchange
:
$("#Options").change(function () {
var optionId = $(this).val();
if (optionId == 0) {
$(".options").hide();
}
else {
var option = $(this).find(":selected").text();
option = option.split(' ').join('_')
$(".options").find("#options_link").attr("href", "Options/+option+.html")
$(".options").show();
}
}).change(); //append change() here
对于那些不理解这个简单答案(包括OP)的人,请尝试阅读有关change()
的jQuery文档答案 2 :(得分:0)
您可以定义一个单独的函数,然后在每个事件中调用它们,如:
$(document).ready(function () {
$(".terms").hide();
options($("#Options"));
$("#Options").change(function(){
options($(this));
})
});
function options(optionsElem) {
var optionId = optionsElem.val();
if (optionId == 0) {
$(".options").hide();
}
else {
var option = optionsElem.find(":selected").text();
option = option.split(' ').join('_')
$(".options").find("#options_link").attr("href", "Options/+option+.html")
$(".options").show();
}
});
答案 3 :(得分:0)
不是将此传递给任何可以执行的功能......
$(document).ready(function () {
$(".terms").hide();
$("#Options").change(function () {
Myfun();
});
function Myfun(){
var optionId = $("#Options").val();
if (optionId == 0) {
$(".options").hide();
}
else {
var option = $("#Options").find(":selected").text();
option = option.split(' ').join('_')
$(".options").find("#options_link").attr("href", "Options/+option+.html")
$(".options").show();
}
}
});
您也可以调用此函数onload。