Question

我有两个jQuery函数，一个用于日期时间选择器

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>


<script type="text/javascript">
    $(document).ready(function () {         
        $("#txtDate").datepicker();
    });
</script>

带有复选框的Multiselect Dropdown / Listbox的另一个。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<link href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css"
    rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
<link href="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/css/bootstrap-multiselect.css"
    rel="stylesheet" type="text/css" />
<script src="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/js/bootstrap-multiselect.js"</script>

<script type="text/javascript">
    $(document).ready(function () {
        $('[id*=lstFruits]').multiselect({
            includeSelectAllOption: true
        });
    });

ASP代码为：

表示日期时间

<asp:TextBox ID="txtDate" runat="server" ></asp:TextBox>

下拉列表

<asp:ListBox ID="lstFruits" runat="server" SelectionMode="Multiple">
    <asp:ListItem Text="Mango" Value="1" />
    <asp:ListItem Text="Apple" Value="2" />
    <asp:ListItem Text="Banana" Value="3" />
    <asp:ListItem Text="Guava" Value="4" />
    <asp:ListItem Text="Orange" Value="5" />
</asp:ListBox>

我遇到的问题是，如果我将它们放在我的代码中，只有日期时间选择器工作，而不是多选下拉列表和多选下拉列表仅在我工作时，它们都不能一起工作注释掉相应的日期时间选择器代码。

有一些我无法弄清楚的功能障碍。

Answer 1

这是一个基于您在页面中引用的文件的工作示例，它是基于HTML而不是ASPX，它将很容易使用。

注意： - 你引用了两个jquery版本，我评论了其中一个

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<!--<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>!-->
<link href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
<link href="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/css/bootstrap-multiselect.css" rel="stylesheet" type="text/css" />
<script src="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/js/bootstrap-multiselect.js">
</script>
<script type="text/javascript">
  $(document).ready(function() {
    $("#txtDate").datepicker();
    $('[id*=lstFruits]').multiselect({
      includeSelectAllOption: true
    });
  });
</script>

请查看完整示例here

jQuery函数无法正常工作

1 个答案: