Question

在bootstrap容器中......我使用了这段代码：

<div class="panel-heading">
  <div class="row">
    <div class="col-xs-6 text-center">
      <a href="" class="active" id="loginFormLink" onclick="LoginFormOpen()"> Login </a>
    </div>

    <div class="col-xs-6 text-center">
      <a href="" id="registerFormLink" onclick="alert('here....')"> Register </a>
    </div>

</div>
</div>

onclick警告功能在注册时起作用，但是我试图在onclick上执行以登录的功能不是....为什么？...

这是

function LoginFormOpen()
{
    alert('Testing....');
    /*$('#loginForm').delay(100).fadeIn(100);
    $('#registerForm').fadeOut(100);
    $('#registerFormLink').removeClass('active');
    $(this).addClass('active');
    e.preventDefault();
    });*/
}

Answer 1

可能会发生这种情况，因为您使用的是onclick属性以及href属性。如果您使用onclik，则无需放置href。这就是为什么页面可能会重定向到空白页面。

我认为您因为手牌而使用href属性，所以请按照以下代码进行操作::

href="javascript:void(0);"

所以，你最后的HTML应该是这样的::

<div class="panel-heading">
  <div class="row">
    <div class="col-xs-6 text-center">
      <a href="javascript:void(0);" class="active" id="loginFormLink" onclick="LoginFormOpen()"> Login </a>
    </div>

    <div class="col-xs-6 text-center">
      <a href="javascript:void(0);" id="registerFormLink" onclick="alert('here....');"> Register </a>
    </div>

</div>
</div>

Answer 2

这完全是范围问题。如果在$(document).ready范围内定义函数，则只能在其中调用它。将功能移到$(document).ready之外，它应该可以正常工作。

所以如果你有：

$(document).ready(function() {
  function LoginFormOpen() {
    alert('Testing....');
    /*$('#loginForm').delay(100).fadeIn(100);
    $('#registerForm').fadeOut(100);
    $('#registerFormLink').removeClass('active');
    $(this).addClass('active');
    e.preventDefault();
    });*/
  }
});

真的应该是：

$(document).ready(function() {

});

function LoginFormOpen() {
  alert('Testing....');
  /*$('#loginForm').delay(100).fadeIn(100);
  $('#registerForm').fadeOut(100);
  $('#registerFormLink').removeClass('active');
  $(this).addClass('active');
  e.preventDefault();
  });*/
}

Href onclick功能引导程序

2 个答案: