2011-11-30 84 views
0

我正在製作一個表單,將一些值提交給預訂酒店房間的網站。網址應該是這樣的:如何用JavaScript更改URL的格式?

https://secure.netbookerng.com/soahotel/zablijak/cs/hseoptx_UZ/hseoid_22959509.html?autosearch=true&begindate=11/30/11&enddate=12/16/11&adults=1&children=0&rooms=1 

我只設法獲取類似如下的URL:

https://secure.netbookerng.com/soahotel/zablijak/cs/hseoptx_UZ/hseoid_22959509.html?begindate=11%2F30%2F2011&enddate=12%2F15%2F2011&rooms=1&adults=1&children=0&Check=Check+Availability 

這裏是我做過什麼:

<!DOCTYPE html> 
<html> 

<head> 
<title>Demo</title> 
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.16.custom.css" rel="stylesheet" /> 
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script> 
<script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script> 

<script> 

    $(function() { 
     $('#datepicker1').datepicker({minDate:0,dateFormat:'mm/dd/yy'}); 
     $("#datepicker2").datepicker({minDate:0,dateFormat:'mm/dd/yy'}); 
     $('#arrival').datepicker({dateFormat:'mm/dd/yy'}); 
     $("#departure").datepicker({dateFormat:'mm/dd/yy'});  

     $("#posalji").click(function(){ 
      var datum1=$('#datepicker1').val(); 
      var datum2=$('#datepicker2').val(); 
      var rooms=$('#rooms').val(); 
      var adults=$('#adults').val(); 
      var children=$('#children').val(); 
      datum1=datum1.substring(3,5)+"/"+datum1.substring(0,2)+"/"+datum1.substring(8,10); 
      datum2=datum2.substring(3,5)+"/"+datum2.substring(0,2)+"/"+datum2.substring(8,10); 
     });  
    }); 
</script> 

</head> 
<body>  

<table border="0" cellspacing="1" cellpadding="1" style="background-color: #7a7c72; opacity: 0.8; margin-top: 15px; width: 230px;"> 
    <tbody> 
     <tr> 
      <td align="center" style="background-color: #61625b; color: #ffffff; font-weight: bold; padding: 3px; font-size: 13px;">CHECK AVAILABILITY</td> 
     </tr> 
     <tr> 
      <td align="center"><form id="availability" type="get" action="https://secure.netbookerng.com/soahotel/zablijak/cs/hseoptx_UZ/hseoid_22959509.html"> 

       <table border="0" cellspacing="2" cellpadding="0" style="width: 200px;"> 
        <tbody> 
         <tr> 
          <td height="22" colspan="3" align="left" valign="bottom" style="font-size: 11px; font-weight: bold;"><label>Check in</label></td> 
         </tr> 
         <tr> 
          <td height="17" colspan="3" align="left" valign="bottom"><input name="begindate" type="text" id="datepicker1" /></td> 
         </tr> 
         <tr> 
          <td height="17" colspan="3" align="left" valign="bottom" style="font-size: 11px; font-weight: bold;"><label>Check out</label></td> 
         </tr> 
         <tr> 
          <td height="17" colspan="3" align="left" valign="bottom"><input id="datepicker2" name="enddate" type="text" /></td> 
         </tr> 
         <tr style="font-size: 11px; font-weight: bold;"> 
          <td width="65" height="17" align="left" valign="bottom">Rooms</td> 
          <td width="65" height="17" align="left" valign="bottom">Adults</td> 
          <td width="65" height="17" align="left" valign="bottom">Children</td> 
         </tr> 
         <tr> 
          <td width="65" height="17" align="left" valign="bottom"><select name="rooms" id="rooms"> <option value="1" selected="selected">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> </select></td> 
          <td width="65" height="17" align="left" valign="bottom"><select name="adults" id="adults"> <option value="1" selected="selected">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> </select></td> 
          <td width="65" height="17" align="left" valign="bottom"><select name="children" id="children"> <option value="0" selected="selected">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> </select></td> 
         </tr> 
         <tr> 
          <td height="40" colspan="3" align="center"> 
          <input id="posalji" name="Check" type="submit" value="Check Availability"> 
          </td> 
         </tr> 
        </tbody> 
       </table> 

       </form></td> 
     </tr> 
    </tbody> 
</table> 


</body> 

</html> 

爲了使它的工作我需要:

  • 取代%2F從與URL只是/
  • 我需要添加autosearch=true?
  • 我需要刪除名爲Check

最後一個參數我不使用JavaScript真的很好,我會欣賞一些幫助。

+0

真正的url構建在哪裏?我看到的變數,但不是網址建設 – alonisser

+0

請注意,%2F只是url編碼/我相信這不是問題 – alonisser

回答

1

隱藏input元素添加到您的窗體:<input type="hidden" name="autosearch" value="true" />

要刪除「檢查」參數,消除從input元素name屬性。

+0

最佳答案,那正是我需要的。目標頁面接受了編碼的URL,問題在於參數中。謝謝! – sfrj

0

的Javascript具有DecodeURIComponent功能:

http://www.w3schools.com/jsref/jsref_decodeURIComponent.asp

  1. ** DecodeURIComponent(uriString中)(實施例%2F變得/)。

  2. 使用搜索(regEx)找到您的Check參數,並獲取其最後發生的索引。

  3. 使用subStr(0,uriString.Length - index + 1)在您想要刪除的參數之前從頭到尾抓取URI。

  4. 將您的自動搜索追加到修剪過的字符串中。

注意,這是假定檢查是真正最後作爲步驟3的指數後就會被裁剪一切「檢查」 ......使用與步驟2中的正則表達式更好表達式將讓你找到的開始和這個字符串的末端索引並通過手術將其刪除,而不會影響之後可能發生或可能不會發生的任何事情。

+0

如果您想在「?」之後插入自動搜索,字符(所以它是URI中的第一個參數,你可以簡單地找到該索引?,在那裏分割URI字符串,將自動搜索字符串值附加到第一個字符串,然後粘貼後面的一半URI ...確保在字符串的後半部分使用&符號前綴,因爲它不再是URI中的第一個參數。 –