<script type="text/javascript">
function achat_change_themes() {
var rel = $('link[title="chat_theme"]');
var select = $('#achat_times').attr('value');
if(select == "GrayScale") {
rel.attr('src' , 'www.avacwebthemes.vacau.com/css/mario_theme.css');
}
else if (select == "Mario") {
rel.attr('src' , 'www.avacwebthemes.vacau.com/css/mario_theme.css');
}
else if (select == "Eartone") {
rel.attr('src' , 'www.avacwebthemes.vacau.com/css/mario_theme.css');
}
else if (select == "Dark") {
rel.attr('src' , 'www.avacwebthemes.vacau.com/css/mario_theme.css');
}
else if (select == "Floral") {
rel.attr('src' , 'www.avacwebthemes.vacau.com/css/mario_theme.css');
}
else if (select == "Military") {
alert(www.avacwebthemes.vacau.com/css/mario_theme.css);
}
}
</script>
HTML 模拟
<select id="achat_themes" onChange="achat_change_themes();">
<option value="GrayScale">GrayScale</option>
<option value="Mario">Mario</option>
<option value="EarthTone">EarthTone</option>
<option value="Dark">Dark</option>
<option value="Floral">Floral</option>
<option value="Military">Military</option>
</select>
基本上我想做的是在 select 的更改事件上它将更改 head 中链接标记的 src ...例如
<link type="text/css" rel="stylesheet" title="chat_theme" href="http://sourcefile.com/css/file.css">
每次我在测试这个时都会收到最后一个选择的警报,我想更改它,只需 5 分钟的时间,然后用 jQuery 尝试 javascript 函数。它没有运行任何建议吗?
我尝试取出整个内部代码,但总是出现achat_change_themes未定义?我一定是函数写错了?
最佳答案
我有一些建议,既试图直接回答您的问题,如果您不介意,也试图帮助改进您的代码:
建议 1: 我认为您正在寻找链接的“href”属性,而不是“src”。
建议2:我猜这只是为了说明这一点,但以防万一(我已经忘记了很多这样的事情):请务必更改“www.avacwebthemes.vacau”。到时候将 com/css/mario_theme.css' 复制到适当的地址。
建议3:使用javascript switch statement在你的函数中而不是一堆 if 。它更干净:
switch(select)
{
case "Grayscale":
{
rel.attr('href', 'www.avacwebthemes.vacau.com/css/mario_theme.css');
break;
}
case "Mario":
{
rel.attr('href', 'www.avacwebthemes.vacau.com/css/mario_theme.css');
break;
}
//Etc
}
建议 4: 如果您尝试使用 jQuery,我建议使用类似以下代码的内容(脚本 block 位于正文内部,而不是头部):
<script>
$(function() {
$('#achat_themes').change( function() {
var rel = $('link[title="chat_theme"]');
switch($(this).val())
{
case "Grayscale":
{
rel.attr('href', 'www.avacwebthemes.vacau.com/css/mario_theme.css');
break;
}
case "Mario":
{
rel.attr('href', 'www.avacwebthemes.vacau.com/css/mario_theme.css');
break;
}
//Etc
}
});
});
</script>
关于javascript - 更改选择框的 CSS 样式表 src onChange,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14670135/