Question

我试图在按钮点击时显示div，但我没有从下面的代码中取得成功。如果我在代码中做了任何错误，请告诉我。

＆＃13;

function showDiv() {
  document.getElementById('sign-in').style.display = "block";
}

＆＃13;

<a class="btn btn-default log-bar" href="#" role="button" onclick="showDiv()">Login</a>


<div id="sign-in" class="login" style="display: none;">
  <form>
    <div class="row">
      <div class="col-md-3">
        <div class="form-group inline-form">
          <input type="email" class="form-control" id="email" Placeholder="email">
        </div>
      </div>
      <div class="col-md-3">
        <div class="form-group inline-form">
          <input type="password" class="form-control" id="pwd">
        </div>
      </div>
      <div class="col-md-3">
        <div class="checkbox">
          <label><input type="checkbox"> Remember me</label>
        </div>
      </div>
      <div class="col-md-3">
        <button type="submit" class="btn btn-default ">Submit</button>
      </div>
    </div>
  </form>
</div>

＆＃13;

Answer 1

将public void TestMethod1() { var get = getservice(); VSettlement ne = new VSettlement();//vm ne.name = " N LTD"; ne.Settle_date = new DateTime(2017, 4, 26); ne.sAmount = 0; ne.SPerct = 0; ne.kCharges = 0; ne.AAmount = 0; ne.AmountReceived = 88500; var file = new Mock<HttpPostedFileBase>(); file.Setup(x => x.FileName).Returns("NLTD-52.xlsx"); ne.details = file.Object;(httppostfilebase in viewmodel) var server = new Mock<HttpServerUtilityBase>(); server.Setup(x => x.MapPath("~/trax.Tests")).Returns(@"C:\Users\Development Team\documents\visual studio 2015\Projects\trax.Tests"); var httpContext = new Mock<HttpContextBase>(); httpContext.Setup(x => x.Server).Returns(server.Object); VReceipt pay = new VReceipt();//vm pay.AccountID = 1032; pay.Amount = 88500; pay.PaymentDate=new DateTime(2017, 4, 26); pay.PaymentModes = new SelectList("Cash"); pay.Accounts = new SelectList("CHENNAI CASH"); // act int? s = 0; var res= get.Add(ne, pay, 1012, out s); Assert.IsTrue(res); }更改为getElementByid（getElementById改为i）

＆＃13;

function showDiv() {
  document.getElementById('sign-in').style.display = "block";
}

＆＃13;

Answer 2

您输错了document.getElementByid它应该是大写I document.getElementById

function showDiv() {
  document.getElementById('sign-in').style.display = "block";
}

<a class="btn btn-default log-bar" href="#" role="button" onclick="showDiv()">Login</a>


<div id="sign-in" class="login" style="display: none;">
  <form>
    <div class="row">
      <div class="col-md-3">
        <div class="form-group inline-form">
          <input type="email" class="form-control" id="email" Placeholder="email">
        </div>
      </div>
      <div class="col-md-3">
        <div class="form-group inline-form">
          <input type="password" class="form-control" id="pwd">
        </div>
      </div>
      <div class="col-md-3">
        <div class="checkbox">
          <label><input type="checkbox"> Remember me</label>
        </div>
      </div>
      <div class="col-md-3">
        <button type="submit" class="btn btn-default ">Submit</button>
      </div>
    </div>
  </form>
</div>

Answer 3

简单

<script>
function showDiv() {
   document.getElementById('sign-in').style.display = "block";
}
</script>

Answer 4

getElementById()是一个函数，它区分大小写。您需要将getElementByid()写为getElementById()。

注意：getElementById()中的 i 应为首都。

Answer 5

我是否可以强烈建议您使用jQuery来执行此操作 - 这使得此任务在所有浏览器上都是微不足道的。要使用jQuery执行此操作，请执行以下步骤。

在您的网页<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>中包含jQuery脚本库。

将id属性添加到按钮<a class="btn btn-default log-bar" href="#" id="loginButton" role="button" onclick = "showDiv()" >Login</a>。

将以下Javascript添加到您的页面：

<script>
    $(function() {
        $("#loginButton").click(function() {
            $("#sign-in").show();
        });
    });
</script>

如何使用Javascript在按钮单击上显示div

5 个答案: