为什么“点击文档”没有触发<a> elements in jQuery datepicker?

时间:2017-09-10 15:43:22

标签: javascript jquery datepicker

On clicking on link and box, event is triggered appropriately but on clicking on date in datepicker nothing is happening although each date has class "ui-state-active" (date's class can be checked in console).

Below is fully executable snippet

$(document).ready(function(){
  $("#date").datepicker();

  $(document).on('click',function(event){
    var clickover=$(event.target);
    if(clickover.hasClass("box")){
      $("#box").text("on box");
    }
    else if(clickover.hasClass("link")){
      $("#box").text("on link");
    }
    else if(clickover.hasClass("ui-state-active")){
      $("#box").text("on date");
    }
  });
});
#box{
  height:100px;
  width:100px;
  border:2px solid green;
}
<!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

    <!-- jQuery library -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

    <!-- Latest compiled JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <!-- font Montserret -->
    <link href="https://fonts.googleapis.com/css?family=Montserrat:100,400,500" rel="stylesheet">

    <!-- custom js file -->
    <script type="text/javascript" src="js/en1_page.js"></script>

    <!-- To Use jquery ui below two are also required -->
    <!-- jquery css -->
    <link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/themes/sunny/jquery-ui.css" rel="stylesheet">
    <!-- jquery-ui.js  library -->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script>

<a href="#" class="link1 link">Link</a>

<div class="box" id="box"></div>

<div id=date></div>

0 个答案:

没有答案