JavaScript编码字段而不会破坏显示

Question

我想在提交$ _GET请求之前对特定搜索字段进行编码。我正在做的是在提交表单之前在该字段上应用encodeURIComponent（）函数

$('#frmMainSearch').submit(function() {
    var field = $(this).find('#searchinput');
    field.val(encodeURIComponent(field.val()));
});

问题是，只要文本被编码，该字段就会显示看起来有点奇怪的编码文本。我能做些什么来避免它吗？

实施例： 我输入 Hello＆amp;你好即可。当我点击提交按钮时，它会在刷新页面之前变成类似 Hello％26 Hello 的内容。我想避免这种情况。

任何解决方案？

由于

Answer 1

我最近不得不解决同样的问题。以下是我的表现方式：

1. 创建您希望面向用户的输入字段，例如：

   <input class="really-nice-looking-field" 
          id="search-text-display" 
          placeholder="Search for stuff..." 
          type="text">
   

2. 请注意，在显示的字段中，name属性被明确省略。这会使search-text-display字段远离提交的表单，因此您不会有未使用的参数。

3. 创建一个隐藏字段，实际将用于提交，如下所示：

   <input id="search-text" name="search_text" type="hidden">
   

4. 从表单中捕获提交事件，以便在提交表单之前填充隐藏字段，如下所示：

   $('#site-search').submit(function() {
       $('#search-text').val(
           encodeURIComponent($('#search-text-display').val())
       );
   });
   

根据需要，当您的参数通过转义时，这将使您的用户显示的输入字段保持不变：

    Parameters: {"utf8"=>"✓", "search_text"=>"hello%20%26%20hello"}