將javascript變量傳遞給表單/輸入字段作為onsubmit href鏈接

Question

id喜歡有一個輸入框，用戶可以輸入一個搜索詞，然后傳遞給一個javascript函數，然后將一些url段與搜索詞組合在一起創建一個完整的url。 到目前為止它一直工作正常，沒有周圍的形式，但我想添加一個表單，以便用戶只需按Enter鍵而不是單擊提交按鈕。

提交按鈕代碼：

<a href="javascript: void(0)" onClick="this.href = i1 + document.getElementById('intranet').value + i3" target="_blank">
                    <div id="submit" class="out"
                        onMouseOver="document.getElementById('submit').className = 'over';"
                        onMouseOut="document.getElementById('submit').className = 'out';">
                        <span>Submit</span>
                    </div>
                </a>

錯誤的表格/輸入代碼：

<form action="" onSubmit="this.href = i1 + document.getElementById('intranet').value + i3; return false;" method="get" target="_blank">
                <input type="text" id="intranet" size="15" value="Search Intranet.."
                    onFocus="document.getElementById('intranet').value = ''"
                    onBlur="document.getElementById('intranet').value = 'Search Intranet..'" / >    
                </form>

可能的js函數來創建url：

<script language="javascript" type="text/javascript">
                    function urlGen(value)
                        {
                            var i1 = "seg1";
                            var i2 = document.getElementById('intranet').value;
                            var i3 = "seg2";

                            var fullURL = i1 + document.getElementById('intranet').value + i3;

                            return fullURL;
                        }
                </script>

Answer 1

使用表單的onSubmit事件，在其中設置適當的數據到Intranet的輸入 - 不要更改this.href（表單沒有這樣的屬性）。 請記住，可以在客戶端禁用JavaScript。 考慮將隱藏的輸入放入i1和i2的表單中，並在服務器端執行所有組合邏輯。

<form action="" onSubmit="urlGen()">
...
</form>

<script language="javascript" type="text/javascript">
                    function urlGen()
                        {


                            var i1 = "urlSeg1";
                            var i2 = document.getElementById('intranet').value;
                            var i3 = "urlSef2";

                            document.getElementById('intranet').value = i1 + i2 + i3;


                        }
                </script>

Answer 2

也許是這樣的：

<form action="" onSubmit="urlGen(this);" method="get" target="_blank">
    <input type="text" id="intranet" size="15" value="Search Intranet.."
                 onFocus="this.value = ''"
                 onBlur="this.value = 'Search Intranet..'" / >    
</form>

function urlGen(f){
   var i1 = 'urlSeg1';
   var i2 = f.intranet.value;
   var i3 = 'urlSef';
   f.action = i1 + i2 + i3;
   return true;
}

Answer 3

還應該注意，這是一個側邊欄小工具，只需要使用ie和服務器/客戶端限制為空。 嘗試了這兩種方法（我認為 - 仍然是初學者），但當我點擊輸入時發生的所有事情都是頁面重新加載（target =“_ blank”打開相同的新頁面）。

我想完全取消提交按鈕區域，但它具有功能，沒有表單標簽。

我現在擁有的：

<div id="row2">

                <script language="javascript" type="text/javascript">
                    function urlGen(f)
                        {
                            var i1 = "seg1";
                            var i2 = f.intranet.value;
                            var i3 = "seg2";

                            var fullURL = i1 + i2 + i3;
                            f.action = i1 + i2 + i3;

                            return true;
                        }
                </script>

                <!-- Intranet Search -->
                <form action="" onSubmit="urlGen(this)" method="post" target="_blank">
                <input type="text" id="intranet" size="15" value="Search Intranet.."
                    onFocus="this.value = ''"
                    onBlur="this.value = 'Search Intranet..'" / >   
                </form>

            <br><br>

                <a href="javascript: void(0)" onClick="this.href = i1 + document.getElementById('intranet').value + i3" target="_blank">
                    <div id="submit" class="out"
                        onMouseOver="document.getElementById('submit').className = 'over';"
                        onMouseOut="document.getElementById('submit').className = 'out';">
                        <span>Submit</span>
                    </div>
                </a>
            </div>