如何将搜索texarea中的搜索关键字转换为前向链接?

时间:2016-10-05 11:29:32

标签: jquery html forms search textarea

我有一个小脚本计划像这样运作: 当有人搜索产品并点击白色箭头时,它会将关键字作为易趣产品搜索结果转发给易趣。

我希望当有人搜索时说:samsung galaxy s5,脚本会生成kewords并将其转发到正确的地址。生病解释:

例如:

我正在搜索 samsung galaxy s5 ,所以完整的链接地址是:

  

http://rover.ebay.com/rover/1/711-53200-19255-0/1?icep_ff3=9&pub=5575165347&toolid=10001&campid=5337851510&customid=&icep_uq=samsung+galaxy+s5&icep_sellerId=&icep_ex_kw=&icep_sortBy=12&icep_catId=&icep_minPrice=&icep_maxPrice=&ipn=psmain&icep_vectorid=229466&kwid=902099&mtid=824&kw=lg

因此,它应该转发我的意思:

  

http://www.ebay.com/sch/items/?_nkw=samsung+galaxy+s5&_sacat=&_ex_kw=&_mPrRngCbx=1&_udlo=&_udhi=&_sop=12&_fpos=&_fspt=1&_sadis=&LH_CAds=&rmvSB=true

但是,根据我当前的脚本,我得到的是(下面)地址:

  

http://www.ebay.com/?q=samsung+galaxy+s5&rmvSB=true

我尝试

  

http://rover.ebay.com/rover/1/711-53200-19255-0/1?icep_ff3=9&pub=5575165347&toolid=10001&campid=5337851510&customid=&icep_uq=

之前

  

&安培; icep_sellerId =安培; icep_ex_kw =安培; icep_sortBy = 12&安培; icep_catId =安培; icep_minPrice =安培; icep_maxPrice =安培; IPN = psmain&安培; icep_vectorid = 229466&安培; KWID = 902099&安培; MTID = 824&安培;千瓦= LG

但是我得到了相同的地址结果:

  

http://www.ebay.com/?q=samsung+galaxy+s5&rmvSB=true

以下是代码:

<!DOCTYPE html>
<html>
<head>
<title>Search Box Example 2 - default placeholder text gets cleared on click</title>
<meta name="ROBOTS" content="NOINDEX, NOFOLLOW" />
<!-- Add jQuery to your website if you don't have it already -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<!-- JAVASCRIPT to clear search text when the field is clicked -->
<script type="text/javascript">
$(function() {
    $("#tfq2b").click(function() {
        if ($("#tfq2b").val() == "Search our website"){
            $("#tfq2b").val(""); 
        }
    });
});
</script>
<!-- CSS styles for standard search box with placeholder text-->
<style type="text/css">
    #tfheader{
        background-color:#c3dfef;
    }
    #tfnewsearch{
        float:right;
        padding:20px;
    }
    .tftextinput2{
        margin: 0;
        padding: 5px 15px;
        font-family: Arial, Helvetica, sans-serif;
        font-size:14px;
        color:#666;
        border:1px solid #0076a3; border-right:0px;
        border-top-left-radius: 5px 5px;
        border-bottom-left-radius: 5px 5px;
    }
    .tfbutton2 {
        margin: 0;
        padding: 5px 7px;
        font-family: Arial, Helvetica, sans-serif;
        font-size:14px;
        font-weight:bold;
        outline: none;
        cursor: pointer;
        text-align: center;
        text-decoration: none;
        color: #ffffff;
        border: solid 1px #0076a3; border-right:0px;
        background: #0095cd;
        background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5));
        background: -moz-linear-gradient(top,  #00adee,  #0078a5);
        border-top-right-radius: 5px 5px;
        border-bottom-right-radius: 5px 5px;
    }
    .tfbutton2:hover {
        text-decoration: none;
        background: #007ead;
        background: -webkit-gradient(linear, left top, left bottom, from(#0095cc), to(#00678e));
        background: -moz-linear-gradient(top,  #0095cc,  #00678e);
    }
    /* Fixes submit button height problem in Firefox */
    .tfbutton2::-moz-focus-inner {
      border: 0;
    }
    .tfclear{
        clear:both;
    }
</style>
</head>
<body>
    <!-- HTML for SEARCH BAR -->
    <div id="tfheader">
        <form id="tfnewsearch" method="get" action="http://rover.ebay.com/rover/1/711-53200-19255-0/1?icep_ff3=9&pub=5575165347&toolid=10001&campid=5337851510&customid=&icep_uq=&icep_sellerId=&icep_ex_kw=&icep_sortBy=12&icep_catId=&icep_minPrice=&icep_maxPrice=&ipn=psmain&icep_vectorid=229466&kwid=902099&mtid=824&kw=lg">
                <input type="text" id="tfq2b" class="tftextinput2" name="q" size="21" maxlength="120" value="Search our website"><input type="submit" value="&gt;" class="tfbutton2">
        </form>
        <div class="tfclear"></div>
    </div>
</body>
</html>

这是一个活的:JSfiddle

1 个答案:

答案 0 :(得分:1)

您必须将所有其他查询参数添加为隐藏输入,例如:

<body>
<!-- HTML for SEARCH BAR -->
<div id="tfheader">
       <form id="tfnewsearch" method="get" action="http://rover.ebay.com/rover/1/711-53200-19255-0/1">
            <input type="text" id="tfq2b" class="tftextinput2" name="_nkw" size="21" maxlength="120" value="Search our website">
              <input type='hidden' name='icep_ff3' value='9'>
              <input type='hidden' name='pub' value='5575165347'>
              <input type='hidden' name='toolid' value='10001'>
              <input type='hidden' name='campid' value='5337851510'>
              <input type='hidden' name='icep_sortBy' value='12'>
              <input type='hidden' name='icep_vectorid' value='229466'>
              <input type='hidden' name='kwid' value='902099'>
              <input type='hidden' name='mtid' value='824'>
              <input type='hidden' name='kw' value='lg'>
            <input type="submit" value="&gt;" class="tfbutton2">

       </form>
       <div class="tfclear"></div>
   </div>
</body>

这将构建您正在寻找的网址。

另一种选择是使用javascript重定向用户并自己解析他的查询,例如:

var q = document.getElementById('tfq2b').value;
var formatQ = q.replace(/\s/g,'+');
window.location.href = 'http://rover.ebay.com/rover/1/711-53200-19255-0/1?icep_ff3=9&pub=5575165347&toolid=10001&campid=5337851510&customid=&icep_uq=&icep_sellerId=&icep_ex_kw=&icep_sortBy=12&icep_catId=&icep_minPrice=&icep_maxPrice=&ipn=psmain&icep_vectorid=229466&kwid=902099&mtid=824&kw=lg&q=' + formatQ;

我发现它不那么干净&#39;然后是第一个选项

修改

我刚看到您还需要将您的textarea的name更改为icep_uq以获取您发布的链接