举栗子:做搜索框,首页input中输入搜索关键字,点击搜索框中的搜索按钮转跳到搜索数据展示页面,我们没有办法决定用户的搜索词,如果用户的搜索词是中文,在url参数传递的过程中会遇到乱码的问题。
%E6%88%91
解决步骤:
1.把搜索框的html+css静态写好
2.点击搜索可以获取到input的value
3.【编码encodeURI】跳转传参
$('.searchText').on('click',function () {
var val=encodeURI($('#search-input').val());
console.log(val);
if(val==''){
alert('请输入搜索内容');
}else {
window.location.href='shopsSearch.html?name='+val+'';
}
});
4.在数据展示页面获取到ulr中的参数【解码decodeURI】再请求ajax
//获取url中的某个参数
function locationSearcher(key) {
var search = location.search.split('?');
if(search.length>1){
var params = search[1].split('&');
for(var i=0;i<params.length; i++){
var item = params[i].split('=');
var k = item[0];
if(key == k){
return item[1];
}
}
}
return null;
}
//获取到url中的name的值
var name=decodeURI(locationSearcher('name'))
console.log(name);