需求：

获取用户输入的字符串，跳转到外链：国家科技图书文献中心，进一步检索。

问题：

你可以点击上述链接，检索条件变成了乱码。为啥？因为该外链的后端对检索字进行了 GBK 编码，所以我们传过去的字符串也应该先进行相同字符集的编码。但是 JavaScript 本身没有特性支持 gbk 的 urlencode，该怎么解决？

解决思路：

关键：利用 form 的 accept-charset 属性，它规定服务器处理表单数据所接受的字符集。
1、创建一个 form，在表单中设置属性 acceptCharset 为 'gbk'，用于对字符串进行 gbk 编码;
2、创建一个 iframe，form 的 target 指向该 iframe，用于表单无刷新提交；
3、新建一个 list.html，form action 指向它，用于接收已编码的字符串，执行回调函数进行外链跳转。

代码示例：

// 实现任意字符集的编码
urlencode: function(str, charset, callback){
    //创建form通过accept-charset做encode
    var form = document.createElement('form');
    form.method = 'get';
    form.style.display = 'none';
    form.acceptCharset = charset;
    if (document.all) {
        //如果是IE那么就调用document.charset方法
        window.oldCharset = document.charset;
        document.charset = charset;
    }

    var input = document.createElement('input');
    input.type = 'hidden';
    input.name = 'str';
    input.value = str;

    form.appendChild(input);
    form.target = '_urlEncode_iframe_';
    document.body.appendChild(form);

    //隐藏iframe截获提交的字符串
    if (!window['_urlEncode_iframe_']) {
        var iframe;
        if(document.all){
            try{
                iframe = document.createElement('<iframe name="_urlEncode_iframe_"></iframe>');
            }catch(e){
                iframe = document.createElement('iframe');
                iframe.setAttribute('name', '_urlEncode_iframe_');
            }
        }else{
            iframe = document.createElement('iframe');
            iframe.setAttribute('name', '_urlEncode_iframe_');
        }

        iframe.style.display = 'none';
        iframe.width = "0";
        iframe.height = "0";
        iframe.scrolling = "no";
        iframe.allowtransparency = "true";
        iframe.frameborder = "0";
        iframe.src = 'about:blank';
        document.body.appendChild(iframe);
    }

    window._urlEncode_iframe_callback = function(str) {
        callback(str);
        if (document.all) {
            document.charset = window.oldCharset;
        }
    };

    //设置回调编码页面的地址，这里需要自行修改
    form.action = 'list_1.html';
    form.submit();

    setTimeout(function() {
        form.parentNode.removeChild(form);
        iframe.parentNode.removeChild(iframe);
    }, 500)
}

// list_1.html
parent._urlEncode_iframe_callback && parent._urlEncode_iframe_callback(location.search.split('=')[1]);