用jquery写一个多引擎切换的代码
时间: 2023-04-09 11:02:06 浏览: 102
jQuery百叶窗动画焦点图切换代码.zip
好的,我可以回答这个问题。以下是一个使用 jQuery 实现多引擎切换的示例代码:
```
$(document).ready(function() {
// 定义搜索引擎列表
var engines = [
{ name: "Google", url: "https://www.google.com/search?q=" },
{ name: "Bing", url: "https://www.bing.com/search?q=" },
{ name: "Yahoo", url: "https://search.yahoo.com/search?p=" }
];
// 创建搜索引擎切换按钮
var buttons = "";
for (var i = 0; i < engines.length; i++) {
buttons += '<button data-url="' + engines[i].url + '">' + engines[i].name + '</button>';
}
$("#engine-buttons").html(buttons);
// 绑定搜索按钮点击事件
$("#search-button").click(function() {
var query = $("#search-input").val();
var url = $("#engine-buttons button.active").data("url") + encodeURIComponent(query);
window.location.href = url;
});
// 绑定搜索引擎切换按钮点击事件
$("#engine-buttons button").click(function() {
$("#engine-buttons button").removeClass("active");
$(this).addClass("active");
});
});
```
这段代码会创建一个搜索框和多个搜索引擎切换按钮,用户可以选择不同的搜索引擎进行搜索。当用户点击搜索按钮时,会根据当前选中的搜索引擎生成相应的搜索链接并跳转到搜索结果页面。
阅读全文