IE10从URL中删除了主题标签 [英] IE10 strips out hashtag from the URL
本文介绍了IE10从URL中删除了主题标签的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我们正在使用非常受限的CMS构建网站。我们可以做的唯一的事情是操纵前端 - 使用模板，使用自定义css和js。
由于我们不能记住用户的选择，我们想出了一个解决方案，通过使用主题标签的URL传递某些信息。这在谷歌浏览器和Mozilla火狐浏览器上工作顺利，但IE10剥离了hashtag和jQuery无法自定义页面的用户。下面是我们如何使用这个东西的一些例子：
FORM：
< form action =/ name-check /＃namecheckpathmethod =GETonsubmit =return checkInput（this）>
< input name =gletype =hiddenvalue =namecheck/>
< input class =efInputText_frontid =company_namename =nametype =textvalue =GR4EGWERGWERGEHGUKYKUWEGWRG/> ;.
< input class =efSubmitButtonFronttype =submitvalue =检查可用性/>& nbsp;
< / form>
常规链接：
< a href =http://www.example.com/package-standard-print/#skipnamecheck>选择< / a>
等等...
Google Chrome的行为（良好）：
http：// www .example.com / name-check /？gle = namecheck& name = REGERGERGERGERGER＃packthree
IE10行为（bad）：
http://www.example.com/name-check/？ gle = namecheck& name = GR4EGWERGWERGEHGUKYKUWEGWERGEGERGEGRRG
当我们拿起哈希时， / b>
//找出我们正在处理的包
var action = window.location.hash。子串（1）;
switch（action）{
case'namecheckpath'：
//感兴趣的页面：/ name-check /
//路径：Home - >名称搜索 - >确认名称 - >网格 - >包页面 - >附加 - > Checkout
//需要做什么：
// 1.下一页必须是grid
$（。stepactive2）。removeClass（'stepactive2'）。addClass '）;
$（'a [href ^ =/ buy /]'）。attr（'href'，'/ package-comparison /＃gridskipnamecheck'）;
$（'form [action ^ =/ name-check /]'）。attr（'action'，'/ name-check /＃namecheckpath'）;
// 2.步骤 - 从第二步（Package）中删除类，以使突出显示效果很好
break;
case'packone'：
//感兴趣的页面：/ name-check /
//路径：Home - >选择包（2-5） - >名称搜索 - >确认名称 - >附加 - > Checkout
//需要做什么：
// 1.下一页是所选软件包的额外页面
$（'。stepactive2'）。text（Choose package） ;
$（'。stepinactive3'）。text（Build package）;
$（'a [href ^ =/ buy /]'）。attr（'href'，'/ buy / self-build-flatpack /＃selfbuild'）;
$（'form [action ^ =/ name-check /]'）。attr（'action'，'/ name-check /＃packone'）;
break;
case'packtwo'：
//感兴趣的页面：/ name-check /
//路径：Home - >选择包（2-5） - >名称搜索 - >确认名称 - >附加 - > Checkout
//需要做什么：
// 1.下一页是所选软件包的附加页面
$（'a [href ^ =/ buy /] ）.attr（'href'，'/ buy / basic-digital /'）;
$（'form [action ^ =/ name-check /]'）。attr（'action'，'/ name-check /＃packtwo'）;
break;
case'packthree'：
//感兴趣的页面：/ name-check /
//路径：Home - >选择包（2-5） - >名称搜索 - >确认名称 - >附加 - > Checkout
//需要做什么：
// 1.下一页是所选软件包的附加页面
$（'a [href ^ =/ buy /] ）.attr（'href'，'/ buy / standard-print /'）;
$（'form [action ^ =/ name-check /]'）。attr（'action'，'/ name-check /＃packthree'）;
break;
case'packfour'：
//感兴趣的页面：/ name-check /
//路径：Home - >选择包（2-5） - >名称搜索 - >确认名称 - >附加 - > Checkout
//需要做什么：
// 1.下一页是所选软件包的附加页面
$（'a [href ^ =/ buy /] ）.attr（'href'，'/ buy / premium-print /'）;
$（'form [action ^ =/ name-check /]'）。attr（'action'，'/ name-check /＃packfour'）;
break;
case'packfive'：
//感兴趣的页面：/ name-check /
//路径：首页 - >选择包（2-5） - >名称搜索 - >确认名称 - >附加 - > Checkout
//需要做什么：
// 1.下一页是所选软件包的附加页面
$（'a [href ^ =/ buy /] ）.attr（'href'，'/ buy / all-inclusive /'）;
$（'form [action ^ =/ name-check /]'）attr（'action'，'/ name-check /＃packfive'）;
break;
case'gridskipnamecheck'：
//感兴趣的页面：/ package-compare /
//路径：Home - >名称搜索 - >确认名称 - >网格 - >包页面 - >附加 - >每个（function（）{
this.href + ='#skipnamecheck';
}）;
$（'a [href ^ =/ package - ]
break;
case'skipnamecheck'：
//感兴趣的页面：/ package-xxx /
//路径：Home - >姓名搜索 - >确认名称 - >网格 - >包页面 - >附加 - > Checkout
if（window.location.href.indexOf（package-self-build）> -1）{
$（'a [href ^ =/ name-check-]' ）.attr（'href'，'/ buy / self-build-flatpack /＃selfbuild'）;
} else if（window.location.href.indexOf（package-basic-digital）> -1）{
$（'a [href ^ =/ name-check-] '）.attr（'href'，'/ buy / basic-digital /'）;
} else if（window.location.href.indexOf（package-standard-print）> -1）{
$（'a [href ^ =/ name-check-] '）.attr（'href'，'/ buy / standard-print /'）;
} else if（window.location.href.indexOf（package-premium-print）> -1）{
$（'a [href ^ =/ name-check-] '）.attr（'href'，'/ buy / premium-print /'）;
} else if（window.location.href.indexOf（package-all-inclusive）> -1）{
$（'a [href ^ =/ name-check-] '）.attr（'href'，'/ buy / all-inclusive /'）;
}
break;
默认值：
//console.log('default'）;
}
问题：剥离主题标签？ ：（
解决方案
解决方案是在名称为action的表单中插入一个隐藏字段。
我还包括一个jQuery代码，从URL中获取所需的值。
//找出需要做什么
var action = window.location.hash.substring（1）;
// IE特定代码：获取GET数据
if（action ==''）{
$ .urlParam = function（name）{
var results = new RegExp（'[\\？& '=（[^&＃] *）'）exec（window.location.href）;
if（results == null）{
return null;
}
else {
return results [1] || 0;
}
}
action = $ .urlParam（'action'）;
}
we are building a website using a very restricted CMS. The only thing we can do is to manipulate the front end - play around with the template, use custom css and js.
Since we cannot "memorise" user's choices, we came up with a solution to pass certain information via the URL using hashtags. This works smoothly on Google Chrome and Mozilla Firefox browsers but IE10 strips out the hashtag and jQuery fails to customize the page for the user. Here are some examples on how we use this thing:
FORM:
<form action="/name-check/#namecheckpath" method="GET" onsubmit="return checkInput(this)">
<input name="gle" type="hidden" value="namecheck" />
<input class="efInputText_front" id="company_name" name="name" type="text" value="GR4EGWERGWERGEHGUKYKUWEGWRG" />
<input class="efSubmitButtonFront" type="submit" value="Check availability" />
</form>
REGULAR LINKS:
<a href="http://www.example.com/package-standard-print/#skipnamecheck">Choose</a>
And so on...
Google Chrome behaviour (good):
http://www.example.com/name-check/?gle=namecheck&name=REGERGERGERGERGER#packthree
IE10 behaviour (bad):
http://www.example.com/name-check/?gle=namecheck&name=GR4EGWERGWERGEHGUKYKUWEGWERGEGERGEGRRG
What we do when we pick up the hash:
// Find out which package we are dealing with
var action = window.location.hash.substring(1);
switch(action) {
case 'namecheckpath':
// Page of interest: /name-check/
// Path: Home -> Name Search -> Confirm Name -> Grid -> Package page -> Extras -> Checkout
// What needs to be done:
// 1. Next page has to be grid
$(".stepactive2").removeClass('stepactive2').addClass('stepinactive2');
$('a[href^="/buy/"]').attr('href', '/package-comparison/#gridskipnamecheck');
$('form[action^="/name-check/"]').attr('action', '/name-check/#namecheckpath');
// 2. Steps - remove class from second step (Package) so that the highlighting works well
break;
case 'packone':
// Page of interest: /name-check/
// Path: Home -> Choose package (2-5) -> Name Search -> Confirm Name -> Extras -> Checkout
// What needs to be done:
// 1. Next page is the extras page for a chosen package
$('.stepactive2').text("Choose package");
$('.stepinactive3').text("Build package");
$('a[href^="/buy/"]').attr('href', '/buy/self-build-flatpack/#selfbuild');
$('form[action^="/name-check/"]').attr('action', '/name-check/#packone');
break;
case 'packtwo':
// Page of interest: /name-check/
// Path: Home -> Choose package (2-5) -> Name Search -> Confirm Name -> Extras -> Checkout
// What needs to be done:
// 1. Next page is the extras page for a chosen package
$('a[href^="/buy/"]').attr('href', '/buy/basic-digital/');
$('form[action^="/name-check/"]').attr('action', '/name-check/#packtwo');
break;
case 'packthree':
// Page of interest: /name-check/
// Path: Home -> Choose package (2-5) -> Name Search -> Confirm Name -> Extras -> Checkout
// What needs to be done:
// 1. Next page is the extras page for a chosen package
$('a[href^="/buy/"]').attr('href', '/buy/standard-print/');
$('form[action^="/name-check/"]').attr('action', '/name-check/#packthree');
break;
case 'packfour':
// Page of interest: /name-check/
// Path: Home -> Choose package (2-5) -> Name Search -> Confirm Name -> Extras -> Checkout
// What needs to be done:
// 1. Next page is the extras page for a chosen package
$('a[href^="/buy/"]').attr('href', '/buy/premium-print/');
$('form[action^="/name-check/"]').attr('action', '/name-check/#packfour');
break;
case 'packfive':
// Page of interest: /name-check/
// Path: Home -> Choose package (2-5) -> Name Search -> Confirm Name -> Extras -> Checkout
// What needs to be done:
// 1. Next page is the extras page for a chosen package
$('a[href^="/buy/"]').attr('href', '/buy/all-inclusive/');
$('form[action^="/name-check/"]').attr('action', '/name-check/#packfive');
break;
case 'gridskipnamecheck':
// Page of interest: /package-comparison/
// Path: Home -> Name Search -> Confirm Name -> Grid -> Package page -> Extras -> Checkout
$('a[href^="/package-"]').each(function() {
this.href += '#skipnamecheck';
});
break;
case 'skipnamecheck':
// Page of interest: /package-xxx/
// Path: Home -> Name Search -> Confirm Name -> Grid -> Package page -> Extras -> Checkout
if(window.location.href.indexOf("package-self-build") > -1) {
$('a[href^="/name-check-"]').attr('href', '/buy/self-build-flatpack/#selfbuild');
} else if(window.location.href.indexOf("package-basic-digital") > -1) {
$('a[href^="/name-check-"]').attr('href', '/buy/basic-digital/');
} else if(window.location.href.indexOf("package-standard-print") > -1) {
$('a[href^="/name-check-"]').attr('href', '/buy/standard-print/');
} else if(window.location.href.indexOf("package-premium-print") > -1) {
$('a[href^="/name-check-"]').attr('href', '/buy/premium-print/');
} else if(window.location.href.indexOf("package-all-inclusive") > -1) {
$('a[href^="/name-check-"]').attr('href', '/buy/all-inclusive/');
}
break;
default:
//console.log('default');
}
QUESTION: Why does IE10 strip out the hashtags? :(
解决方案
The solution was to insert a hidden field to the form with with the name "action".
I have also included a piece of jQuery code that picks up the required value from the URL.
// Find out what needs to be done
var action = window.location.hash.substring(1);
// IE specific code: pick up the GET data
if (action == '') {
$.urlParam = function(name){
var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(window.location.href);
if (results==null){
return null;
}
else {
return results[1] || 0;
}
}
action = $.urlParam('action');
}
这篇关于IE10从URL中删除了主题标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
