php - 重新影响 div 使 jquery 表现得很奇怪

Question

当我用 javascript 编码时，特别是使用一些 jquery 函数时，我意识到一些奇怪的事情。

这是我的代码

<?php // Encoded in UTF-8
    if(isset($_SESSION['username']))
    {
?>

<script type="text/javascript">
    function showEvent(nid)
    {
        $j=jQuery.noConflict();
        $j.get("getGestionEvent.php?type=show&nid="+nid, function(data){
            document.getElementById("eventdiv").innerHTML = data;
        });
    }
</script>

<h2> Event </h2>
<fieldset>
<legend> Add </legend>
<div style="margin-top:10px;">
    <label for="date"> Date : </label>
    <span style="margin-left:20px;">
        <button id="ButtonCreationDemoButton">
            <img src="img/calendar.png" alt="[calendar icon]"/>
        </button>
    </span>
</div>
<form name="events" action="index.php?p=event" method="post">
<div style="margin-top:5px;">
    <span style="margin-left:-1px;">
        <input type="text" name="ButtonCreationDemoInput" id="ButtonCreationDemoInput"/>
    </span>
</div>
<div style="margin-top:10px;">
    <label for="date"> Description : </label>
</div>
<div style="margin-top:5px;">
    <span style="margin-left:-1px;">
        <input type="text" name="desc" id="desc" maxlength="100">
    </span>
</div>
<div style="margin-top:5px;">
    <input type="submit" value="Ajouter">
<div>
</fieldset>
</form>
<div id="eventdiv"></div>
<script type="text/javascript">
    // If I don't call the function, the other script doesn't make an error
    showEvent(0);
</script>

<script>
    $('#ButtonCreationDemoButton').click(
      function(e) {
        $('#ButtonCreationDemoInput').AnyTime_noPicker().AnyTime_picker().focus();
        e.preventDefault();
      } );
</script>
<?php
    }
    else
    {
        echo '<p style="color:red"> You cannot see this page. </p>';
    }
?>

这是一个带有 2 个文本框的简单表单，但我有一个带有日历图像的按钮，可以在文本框 ButtonCreationDemoInput 的顶部显示一个日历，以便用户轻松选择日期。如果我删除调用函数 showEvent() 的行，日历显示就没有问题。但是如果我让该函数在那里，我会收到错误并且看不到日历:

Uncaught TypeError: Property '$' of object [object DOMWindow] is not a function

它指向线上:$('#ButtonCreationDemoButton').click(

顺便说一句，showEvent 只为名为 eventdiv 的 div 提供来自数据库的数据表。

这不是我第一次看到此类问题。仅当我重新影响 div 的内容时才会发生这种情况。

有人可以帮我解决这个问题吗？

Answer 1

$ 是 jQuery 对象的标准变量别名。但你正在使用jQuery.noConflict(); 。这会删除 $ 别名。相反，您必须使用单词 jQuery，即 jQuery('#ButtonCreationDemoButton')。

基本上，showEvent() 被调用，删除 $ 别名，然后尝试在以下 script 标记中使用它。

但是，在您的代码中，您不仅仅调用 jQuery.noConflict()，而是将其分配给变量 $j。这允许您使用 $j 作为 jQuery 别名，即 $j('ButtonCreation...')。