JavaScript - 'this.form'返回undefined

Question

我正在嘗試更改我網站的一部分功能。 目前，我有一個在我的表格外的驗證按鈕。只要用戶點擊該按鈕，就會發生驗證。

但是，我改變了這種方式，驗證按鈕將被刪除，功能將被移動到位於表格內的鏈接按鈕。

下面是我對這段代碼：

<table width="100%" cellpadding="4"> 
<tr> 
    <td valign="top"> 
     //something else here 
    </td> 
    <td valign="top" align="right"> 
     <asp:GridView ID="myGridView" runat="server" OnRowDataBound="myGridView_RowDataBound"> 
     <Columns> 
      <asp:TemplateField HeaderText="Column 1"> 
       <ItemTemplate> 
        // some control 
       </ItemTemplate> 
      </asp:TemplateField> 
      <asp:TemplateField HeaderText="Column 2"> 
       <ItemTemplate> 
        // some control 
       </ItemTemplate> 
      </asp:TemplateField> 
      <asp:TemplateField HeaderText="Column 3"> 
       <ItemTemplate> 
        // some control 
       </ItemTemplate> 
      </asp:TemplateField> 
      <asp:TemplateField HeaderText="Column 4"> 
       <ItemTemplate> 
        <asp:LinkButton ID="lbValidate" runat="server" Text="Validate" OnClientClick="return MyValidation__Submit(this.form)" CausesValidation="true" OnClick="btnValidate_Click"></asp:LinkButton> 
       </ItemTemplate> 
      </asp:TemplateField> 
     </Columns> 
     </asp:GridView> 
    </td> 
</tr> 
</table>  
<div style="margin:10px 0px 10px 0px;"> 
    <asp:Button ID="btnValidate" runat="server" Text="Validate" OnClientClick="return MyValidation__Submit(this.form)" CommandArgument="Save" CausesValidation="true" OnClick="btnValidate_Click" /> 
</div> 

這裏是JavaScript塊，確實驗證的樣本：

<script type="text/javascript"> 
    function MyValidation__Submit(formName) { 
     alert("Test :" + formName); 
     // do validations 

     var joForm = document.getElementById(formName.id); 

     for (var i = 0; i < joForm.elements.length; i++) { 
      // do something 
     } 

     return true; 
    } 
</script> 

這工作得很好驗證按鈕被點擊時，但不在LinkBut​​ton上。 爲了測試它，我不得不把alert("Test :" + formName);行。每當我啓動驗證按鈕時，系統警報都會返回一個字符串值「[object HTMLFormElement]」，我認爲這樣做是可以的，因爲它按照我希望的方式工作。但是，當我嘗試啓動駐留在表內的Validate LinkBut​​ton時，系統警報返回「未定義」，使得我的整個驗證代碼無用。

有人請指出我在這裏失蹤了什麼？我猜測它與控件的層次結構有關，因爲這是唯一被改變的東西。

謝謝！

編輯：

這是最遠的，我可以去，但我仍然不能得到的形式。 此人返回HTMLDivElement。

<asp:LinkButton ID="lbValidate" runat="server" Text="Validate" OnClientClick="return MyValidation__Submit(this.parentNode.parentNode.parentNode.parentNode.parentNode)" CausesValidation="true" OnClick="btnValidate_Click"></asp:LinkButton> 

是的，你讀得對。它有5 .parentNode。

Answer 1

[編輯]接受的答案是最後一個例子

你說你正在使用jQuery，所以如果你只得到了網頁，爲什麼不只是做一個表單元素？

<script type="text/javascript"> 
    function MyValidation__Submit() { 
     // do validations 
     var joForm = $('form').eq(0); 
     for (var i = 0; i < joForm.elements.length; i++) { 
      // do something 
     } 
     return true; 
    } 
</script> 

即使你有一個以上的表格，你可以做

<script type="text/javascript"> 
    function MyValidation__Submit(obj) { 
     // do validations 
     var joForm = $(obj).parents('form').eq(0); 
     for (var i = 0; i < joForm.elements.length; i++) { 
      // do something 
     } 
     return true; 
    } 
</script> 

，並把它作爲

OnClientClick="return MyValidation__Submit(this)" 

沒有jQuery的可以恢復到getElementsByTagName()

<script type="text/javascript"> 
    function MyValidation__Submit() { 
     // do validations 

     // getElementsByTagName("form") searches for any <form> elements on the page and returns an array of elements 
     // the [0] then selects the first one in the array that was found 
     // as long as you've only got one form on the page this should work 
     var joForm = document.getElementsByTagName("form")[0]; 

     for (var i = 0; i < joForm.elements.length; i++) { 
      // do something 
     } 
     return true; 
    } 
</script> 

Answer 2

我的ASP知識有點不成熟，但我相信這是因爲當您爲按鈕使用「this.form」時，「this」的範圍是文檔對象。但是當用於你的LinkBut​​ton時，「this」的作用域就是GridView。如果您要移動觸發器項目，可能會更好地設置您更明確地傳遞給javascript函數的formName。