将html控件ID从aspx文件传递给javascript答案

【问题标题】：Passing html control id to javascript from aspx file将html控件ID从aspx文件传递给javascript
【发布时间】：2015-04-13 03:34:02
【问题描述】：

我很惊讶我还没有找到答案。我在 ASPX 文件中使用标准的 html 按钮（而不是 asp:Button）。从 onclick 属性调用 javascript 函数时，如果 javascript 调用包含变量，则会失败。例如，onclick="func1()" 可以完美运行，而onclick="func2(this.id)" 则不能。我知道this.id 不应该在 asp:Button 中工作，但它应该在标准 html 按钮中失败吗？

编辑：

HTML：

<button id="Hour" type="button" class="butshape" onclick="return middlePress(this.id)" disabled></button>

Javascript：

function middlePress(clicked_id){
    document.getElementById("lengthtext").innerHTML=clicked_id;
    clearEnd();
    switch(clicked_id){
        case "Day":
            document.getElementById("11").innerHTML=Date();
            document.getElementById("12").innerHTML="Previous 24";
            document.getElementById("12").disabled=false;
            break;
        case "Week":
            document.getElementById("11").innerHTML=Date();
            document.getElementById("12").innerHTML="Previous 7 Days";
            document.getElementById("12").disabled=false;
            break;
        case "Month":
            document.getElementById("11").innerHTML=Date();
            document.getElementById("12").innerHTML="Previous 30 Days";
            document.getElementById("12").disabled=false;
            break;
    }
}

【问题讨论】：

它应该可以工作。你的控制台说什么？ jsfiddle.net/hadyg1za
上传相关源代码，我们有东西要调试。如果没有源代码，我们将无法调试，这意味着我们无法为您提供答案。
显示你的函数定义和用于按钮创建的html代码
很难知道如果你不显示你的日志关于抛出什么错误，你也可以在 chrome 控制台f12 中逐步调试它。你也可以尝试使用事件来触发你的函数，而不是使用onclick html 属性，比如object.onclick=function(){myScript};
Yerko - 我不知道你可以这样跨步！谢谢，

标签： javascript html asp.net

【解决方案1】：

更新

现在您已经上传了一些内容供我们使用，我的源代码可以正常工作。

我还更改了按钮的ID 以匹配您的开关盒。源代码中的按钮 id 与任何内容都不匹配，因此为了确保一切正常，我对其进行了更改。

function middlePress(clicked_id){
    document.getElementById("lengthtext").innerHTML=clicked_id;
    switch(clicked_id){
        case "Day":
            document.getElementById("11").innerHTML=Date();
            document.getElementById("12").innerHTML="Previous 24";
            document.getElementById("12").disabled=false;
            break;
        case "Week":
            document.getElementById("11").innerHTML=Date();
            document.getElementById("12").innerHTML="Previous 7 Days";
            document.getElementById("12").disabled=false;
            break;
        case "Month":
            document.getElementById("11").innerHTML=Date();
            document.getElementById("12").innerHTML="Previous 30 Days";
            document.getElementById("12").disabled=false;
            break;
    }
}

<button id="Day" type="button" class="butshape" onclick="return middlePress(this.id)" >Click me</button>
<div id="lengthtext"></div>
<div id="11"></div>
<button id="12" disabled>Button 12</button>

我希望这会有所帮助。快乐编码！

【讨论】：

【解决方案2】：

在您的代码中，按钮被禁用然后click event 将不起作用

尝试关注

应该可以了

html

<input type="button" id="Hour"  class="butshape" onclick=" middlePress(this.id)" value="button">

javascript

function  middlePress(id)
{
alert(id);
}

您可以在这里查看小提琴中的工作示例 DEMO

【讨论】：

【解决方案3】：

您也可以使用asp:button 并将您的Js 函数添加到该元素，如documentation 中所述。检查那个链接，这里是代码。

<%@ Page Language="VB" %>
<script runat="server">
    Sub Button1_Click(ByVal sender As Object, _
        ByVal e As System.EventArgs)
        Label1.Text = "Server click handler called."
    End Sub
</script>

<body>
  <form id="form1" runat="server">
    <asp:Button ID="Button1" Runat="server" 
      OnClick="Button1_Click" 
      OnClientClick="return confirm('Ready to submit.');" 
      Text="Test Client Click" />
    <br />
    <asp:Label ID="Label1" Runat="server" text="" />
  </form>
</body>
</html>

【讨论】：