未捕获的URIError:URI格式错误 - Windows上的jquery UI选项卡

Question

我在本地Windows开发环境中使用jquery UI选项卡.我正在测试他们的演示代码

<div id="tabs">
  <ul>
    <li><a href="#tabs-1">Nunc tincidunt</a></li>
    <li><a href="#tabs-2">Proin dolor</a></li>
    <li><a href="#tabs-3">Aenean lacinia</a></li>
  </ul>
  <div id="tabs-1">
    <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. </p>
  </div>
  <div id="tabs-2">
    <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie</p>
  </div>
  <div id="tabs-3">
    <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede ve</p>

  </div>
</div>

问题是我在这个函数上遇到了"未捕获的URIError:URI格式错误":

function isLocal( anchor ) {
    return anchor.hash.length > 1 &&
        decodeURIComponent( anchor.href.replace( rhash, "" ) ) ===
Uncaught URIError: URI malformed
            decodeURIComponent( location.href.replace( rhash, "" ) );
} 

我怀疑这是由于Windows环境中的URI看起来像这样:

file:///C:/Work/my%20project/yadda%20ac%E7%F5es%20yadda/submenu.html#tabs-1

我怎样才能在本地Windows上运行它,因为我的客户希望在上线之前看到它在那里工作？我已经测试过,我知道这是由uri上特殊字符的编码引起的(比如"acções"这个词).有没有办法让它即使与特殊字符一起工作？

我知道我可以通过删除这些字符并重命名文件/文件夹来解决这个问题,但是我希望有一个更加客户端证明的解决方案,以防他们决定再次重命名文件夹(并且所有内容都只是在他们的脸上进行了CABOOM ).

Answer 1

这是decodeURIComponent方法的结果,该方法假定给定字符串的百分比编码字节是UTF-8(参见ECMAScript第15.1.3节中解码操作的步骤4.d.vii.8 ).你的示例字符串:

"file:///C:/Work/my%20project/yadda%20ac%E7%F5es%20yadda/submenu.html#tabs-1"

包含百分比解码的字节0xE7 0xF5,它不能在有效的UTF-8字符串中一个接一个地出现(它们代表çõWindows-1252中的两个字符).因此,decodeURIComponent会抛出URIError异常.

解决这个问题的一种方法,我尚未测试,是确保您的网页使用UTF-8字符编码,而不是ISO-8859-1我认为是默认的.

为此,请包含以下META标记:

<meta http-equiv="Content-Type" content="text/html;charset=utf-8">

(虽然理想的是包含一个包含charset的Content-Type头,但在涉及文件系统的本地测试中通常不可能这样做.)

并确保网页本身以UTF-8编码.

此外,您的示例字符串在您的网页上显示在哪里？它是如何产生的？您在哪个浏览器上测试了该行为？答案将帮助我告诉你该怎么做.

Answer 2

这是jquery中的一个错误 - http://bugs.jqueryui.com/ticket/9518-存在非UTF8网址.我有同样的问题并解决了它.因为我无法将我的页面编码更改为UTF-8,所以我最终修补了我的jqueryui并使用了Rainer Plumer的解决方案作为解决方法,但我不得不使用它两次,因为我有一些URI参数包含编码的URI.所以我的解决方案是

decodeURIComponent( unescape( unescape(s)) )

更一般地说,应该有重复 - 直到循环,取消导致直到你不断获得相同的结果.这种解决方法肯定不是一个干净的解决方案.这里询问清洁解决方案:

使用非UTF-8编码的get方法提交表单

PS:整个jquery UI补丁:

function isLocal( anchor ) {
        return anchor.hash.length > 1 && 
                decodeURIComponent( unescape( unescape( anchor.href.replace( rhash, "" ) ) ) ) ===
                        decodeURIComponent( unescape( unescape( location.href.replace( rhash, "" ) ) ) );
}