Question

我有一个内容页面（使用母版页），文本框和按钮。我希望按钮在执行任何其他操作之前调用一些javascript。现在我只是测试javascript，所以这是一个草稿。

问题是我的标记发生了变化，因此客户端没有看到所有引号。报价将转换为HTML实体字符串。

所以此代码中的按钮：

<asp:Content ID="Content1" ContentPlaceHolderID="cphMainContent" runat="server">
    <div>
        <asp:TextBox ID="txtInputTopics" 
            runat="server" TextMode="MultiLine" 
            Width="335px" Height="250px" 
            CssClass="mediumFontTextbox"/>
        <asp:Button ID="btnTestAdd" 
            runat="server" Text="Add"
            OnClientClick='CheckFirstAlphaNum(document.getElementById("<%= txtInputTopics.ClientID %>").val);'  />
    </div>
</asp:Content>

更改为：

<input type="submit" name="ctl00$ctl00$cphBody$cphMainContent$btnTestAdd"
   value="Add"
   onclick="CheckFirstAlphaNum(document.getElementById(&quot;&lt;%= txtInputTopics.ClientID %>&quot;).val);" 
   id="cphBody_cphMainContent_btnTestAdd" />

为什么？

Answer 1

那是因为它们应该是HTML编码的。要在由引号分隔的属性值中包含引号，必须对其进行HTML编码。客户端会看到引号就好了。

您的问题是您尝试在具有<%= txtInputTopics.ClientID %>的控件中的属性中使用服务器代码标记（runat="server"）。代码最终在HTML属性中结束，而不是将客户端id值放在属性中。

您需要另一种方法将值放在属性中，例如使用数据绑定表达式。例如，请参阅：https://stackoverflow.com/a/1393407/69083

Answer 2

如Guffa所述，您需要另一种方法来获取输入节点，您可以尝试获取按钮的上一个兄弟

//source: http://www.w3schools.com/dom/prop_element_previoussibling.asp
function get_previoussibling(n) {
  x=n.previousSibling;
  while (x.nodeType!=1) {
    x=x.previousSibling;
  }
  return x;
}

function CheckFirstAlphaNum(element) {
  var inputEl = get_previoussibling(element);
  var value = inputEl.value;
  // do your stuff
}

HTML

<asp:Content ID="Content1" ContentPlaceHolderID="cphMainContent" runat="server">
  <div>
    <asp:TextBox ID="txtInputTopics" 
      runat="server" TextMode="MultiLine" 
      Width="335px" Height="250px" 
      CssClass="mediumFontTextbox"/>
    <asp:Button ID="btnTestAdd" 
      runat="server" Text="Add"
      OnClientClick="CheckFirstAlphaNum(this);" />
  </div>
</asp:Content>

我的标记中的引号被html实体替换？

2 个答案: