當另一個更改時，使用javascript函數更新一個文本框

Question

我有一個javascript函數，可以計算2個不同文本框中的字符，並將值放在第三個文本框中。

這是功能如下：

function CountChars() {
             var subjectLength = document.getElementById("txtBoxSubject").value.length;
             var msgLength = document.getElementById("txtBoxMsg").value.length;
             document.getElementById("txtBoxCnt").value = subjectLength + msgLength;
         }

我使用“ onkeyup”從“消息”文本框中調用它，並且工作正常。

<asp:TextBox ID="txtBoxMsg" runat="server" ClientIDMode="Static" 
              TextMode="MultiLine" onkeyup="CountChars()"></asp:TextBox>

可以使用下拉列表或用戶向其中添加文本來更改主題文本框。 因此，使用“ onkeyup”將不適用於“主題”文本框。 我嘗試使用“ onchange”，但在“計數”文本框中未輸入任何內容。

這是主題html：

 <asp:TextBox ID="txtBoxSubject" runat="server" ClientIDMode="Static" onchange="CountChars()"></asp:TextBox>

我究竟做錯了什么？

每當主題文本框中的文本更改時，如何調用javascript函數？

謝謝。

UPDATE這是“主題”下拉列表，它是更改時調用的函數。

 <asp:DropDownList ID="ddListSubject" runat="server" ClientIDMode="Static" AutoPostBack="true" onchange="SubjectChanged();">
        </asp:DropDownList>

function SubjectChanged() {
        var strSubject = document.getElementById("ddListSubject").value;
        if (strSubject == "Custom") {
            document.getElementById("txtBoxSubject").value = "";
            document.getElementById("txtBoxSubject").focus();
         }
        else {
            document.getElementById("txtBoxSubject").value = strSubject;
        }
        CountChars(); //number appears for a second then disappears
     }

Answer 1

似乎您沒有用半列終止函數。 使用類似onkeyup =“ CountChars（）;”的東西

Answer 2

您的.aspx使用的是MasterPage嗎？ Asp.Net對象的名稱在呈現的頁面中更改。 嘗試使用<％=％Objeto.ClientID>。

function CountChars() {
         var subjectLength = document.getElementById("<%=txtBoxSubject.ClientID %>").value.length;
         var msgLength = document.getElementById("<%= txtBoxMsg.ClientID %>").value.length;
         document.getElementById("<%= txtBoxCnt.ClientID %>").value = subjectLength + msgLength;
     }

或者也許使用JQuery。 查看下面的代碼，按您描述的方式工作。

Subject:
<input id="text1" type="text" />
<br />
Msg
<input id="text2" type="text" multiple style="height: 100px" />
<br />
Total: <span id="total">0</span>

<script type="text/javascript">
    $(document).ready(function () {
        $("input[type=text]").keyup(function () {
            var total = 0;
            $("input[type=text]").each(function () {
                total += $(this).val().length;
            });
            $("#total").html(total);
        });
    });
</script>

希望這對您有幫助

Answer 3

假我...我從下拉列表中刪除了AutoPostBack =“ true”！ 感謝您所有的幫助！！