Javascript 点击图标时未触发JS点击功能_Javascript_Jquery

Javascript 点击图标时未触发JS点击功能

javascript jquery

Javascript 点击图标时未触发JS点击功能,javascript,jquery,Javascript,Jquery,当我点击图标时，我的jQuery点击功能不会被触发。我不知道怎么了。任何帮助都将不胜感激 jQuery $("document").ready(function(){ $("#abc").click(function() { $("#dialog-confirm").dialog({ modal: true, width: 400, height: 400, });

当我点击图标时，我的jQuery点击功能不会被触发。我不知道怎么了。任何帮助都将不胜感激

jQuery

 $("document").ready(function(){
     $("#abc").click(function() {
         $("#dialog-confirm").dialog({
             modal: true,
             width: 400,
             height: 400,
         });
     });
 });

现在这是图片，这是我链接的方式

 echo '<td>' . '<img src="edit.png" style = "height:35px;margin-left :8px;" id="abc">' . '</td>';

echo'.'；

这是我的表单，它将作为对话框弹出

<body>

     <div id="dialog-confirm" style="display:none;">
         <form>      
            <label for="name">Name</label>
            <input type="name" id="name" required>
            <label for="number">Number</label>
            <input type="number" id="number" required>
            <label for="email">Email</label>
            <input type="email" id="email" required>
            <input type="submit" id="submit">
            <input type="submit" id="cancel" value="Cancel">
        </form>
    </div>


</body>


名称
数
电子邮件

有什么帮助吗

以下是完整的页面：

<!doctype HTML>
<head>
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jq‌uery-ui.css">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" ></script>
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js" ></script>

    <script src="smoke.js"></script>
    <link rel="stylesheet" href="css/venview.css">
    <script type="text/javascript">
        function deleterecord ( id ) {
            smoke.confirm("Do you want to delete?", function(result){
                if(result)
                {
                    window.location.href = 'delete_ven.php?id=' + id;
                }
                else{
                    header("Location: ven_view.php");
                }});

        }
        $(document).ready(function(){
            $("#abc").click(function() {
                $('#dialog-confirm').dialog({
                    modal: true,
                    width: 400,
                    height: 400
                });
            });
        });
        $("#submit").click (function(e){
            e.preventDefault();
            var name = $("#name").val;
            var num= $("#number").val;
            var email = $("#email").val;
            var dataString = 'name'+name+'number'+num+'email'+email;
            $.ajax({
                type:'POST',
                data:dataString,
                url:'edit_ven.php',
                success:function(data) {
                    alert(data);
                }
            });
        });
    </script>

</head>
<body>
    <?php




    include 'includes/head.php'; 
    include 'ven_connect.php';
    include "dashboard.php";


    if (isset($_GET["page"])) 
    { 
        $page  = (int) $_GET["page"]; 
    } 
    else 
    { 
        $page=1; 
    }; 
    $start_from = ($page-1) * 4; 

    $result = mysqli_query($conn , "SELECT * FROM vendor LIMIT $start_from, 4") or die (mysqli_error ($conn));

    echo "<table title='Vendors'>";
    echo '<tr>';
    echo    "<th>Sr</th>";
    echo    "<th>Edit</th>";
    echo    "<th>Delete</th>";
    echo    "<th>Name</th>";
    echo    "<th>PhoneNo</th>";
    echo    "<th>Email</th>";
    echo "</tr>";
    echo "<tr>";
    while($row = mysqli_fetch_array( $result )) {

            // display the contents of each row into a table
        echo "<tr>";
        echo '<td>' . $row['id'] . '</td>';
        echo '<td>' . '<img src="edit.png" style = "height:35px;margin-left :8px;" id="abc">' . '</td>';
        echo '<td>' . '<img src="delete.png" style = "height:35px;margin-left :8px;" onclick = "deleterecord('.$row['id'].')">' . '</td>';
        echo '<td>' . $row['Name'] . '</td>';
        echo '<td>' . $row['Number'] . '</td>';
        echo '<td>' . $row['email'] . '</td>';
        echo "</tr>"; 
    } 
    echo "</tr>";

    echo "</table>";
    ?>
    <body>

        <div id="dialog-confirm" style="display:none;">
            <form>      
                <label for="name">Name</label>
                <input type="name" id="name" required>
                <label for="number">Number</label>
                <input type="number" id="number" required>
                <label for="email">Email</label>
                <input type="email" id="email" required>
                <input type="submit" id="update">
                <input type="submit" id="cancel" value="Cancel">
            </form>
        </div>


    </body>
    <?php
    //Pagination!!  
    if($page > 1)
    {

        $prev= $page - 1;

        echo " <a href='{$_SERVER['PHP_SELF']}?page=$prev'>Prev</a> ";
    }
    $result = mysqli_query($conn , "SELECT * FROM vendor") or die (mysqli_error ($conn));
    $total_records = mysqli_num_rows($result); 
    $total_pages = ceil($total_records / 4); 

    $range = 3;


    for ($x = ($page - $range); $x <($page + $range); $x++) {

        if (($x > 0) && ($x <= $total_pages)) {

            if ($x == $page) {

                echo " [<b>$x</b>] ";

            } 

            else {

                echo " <a href='{$_SERVER['PHP_SELF']}?page=$x'>$x</a> ";
            } 
        } 
    } 
    if($page != $total_pages)
    {
        $nextpage=$page+1;
        echo " <a href='{$_SERVER['PHP_SELF']}?page=$nextpage'>Next</a> ";
    }






    ?>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>


</body>

</html>


函数删除记录（id）{
冒烟。确认（“是否要删除？”，函数（结果）{
如果（结果）
{
window.location.href='delete_ven.php？id='+id；
}
否则{
标题（“位置：venu view.php”）；
}});
}
$（文档）.ready（函数（）{
$（“#abc”）。单击（函数（）{
$（“#对话框确认”）。对话框({
莫代尔：是的，
宽度：400，
身高：400
});
});
});
$（“#提交”）。单击（功能（e）{
e、 预防默认值（）；
变量名称=$（“#名称”）.val；
var num=$（“#number”）.val；
var email=$（“#email”）.val；
var dataString='name'+name+'number'+num+'email'+email；
$.ajax({
类型：'POST'，
数据：dataString，
url:'edit_ven.php'，
成功：功能（数据）{
警报（数据）；
}
});
});
名称
数
电子邮件

删除文档周围的引号：

$(document).ready(function() { // remove the quotes here arround document
    $("#abc").click(function() {
        $("#dialog-confirm").dialog({
            modal: true,
            width: 400,
            height: 400 // remove the comma here
        });
    });
});

更新

jQuery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

jQuery用户界面

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

工作

更新

<!doctype HTML>
<head>
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jq‌uery-ui.css">
    <link rel="stylesheet" href="css/venview.css">
</head>
<body>

    // other code

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

    <script src="smoke.js"></script>

    <script type="text/javascript">
        function deleterecord ( id ) {
            smoke.confirm("Do you want to delete?", function(result){
                if(result)
                {
                    window.location.href = 'delete_ven.php?id=' + id;
                }
                else{
                    header("Location: ven_view.php");
                }});

        }
        $(document).ready(function(){
            $("#abc").click(function() {
                $('#dialog-confirm').dialog({
                    modal: true,
                    width: 400,
                    height: 400
                });
            });
        });
        $("#submit").click (function(e){
            e.preventDefault();
            var name = $("#name").val;
            var num= $("#number").val;
            var email = $("#email").val;
            var dataString = 'name'+name+'number'+num+'email'+email;
            $.ajax({
                type:'POST',
                data:dataString,
                url:'edit_ven.php',
                success:function(data) {
                    alert(data);
                }
            });
        });
        </script>

    </body>

</html>


//其他代码
函数删除记录（id）{
冒烟。确认（“是否要删除？”，函数（结果）{
如果（结果）
{
window.location.href='delete_ven.php？id='+id；
}
否则{
标题（“位置：venu view.php”）；
}});
}
$（文档）.ready（函数（）{
$（“#abc”）。单击（函数（）{
$（“#对话框确认”）。对话框({
莫代尔：是的，
宽度：400，
身高：400
});
});
});
$（“#提交”）。单击（功能（e）{
e、 预防默认值（）；
变量名称=$（“#名称”）.val；
var num=$（“#number”）.val；
var email=$（“#email”）.val；
var dataString='name'+name+'number'+num+'email'+email；
$.ajax({
类型：'POST'，
数据：dataString，
url:'edit_ven.php'，
成功：功能（数据）{
警报（数据）；
}
});
});

删除文档周围的引号：

$(document).ready(function() { // remove the quotes here arround document
    $("#abc").click(function() {
        $("#dialog-confirm").dialog({
            modal: true,
            width: 400,
            height: 400 // remove the comma here
        });
    });
});

更新

jQuery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

jQuery用户界面

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

工作

更新

<!doctype HTML>
<head>
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jq‌uery-ui.css">
    <link rel="stylesheet" href="css/venview.css">
</head>
<body>

    // other code

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

    <script src="smoke.js"></script>

    <script type="text/javascript">
        function deleterecord ( id ) {
            smoke.confirm("Do you want to delete?", function(result){
                if(result)
                {
                    window.location.href = 'delete_ven.php?id=' + id;
                }
                else{
                    header("Location: ven_view.php");
                }});

        }
        $(document).ready(function(){
            $("#abc").click(function() {
                $('#dialog-confirm').dialog({
                    modal: true,
                    width: 400,
                    height: 400
                });
            });
        });
        $("#submit").click (function(e){
            e.preventDefault();
            var name = $("#name").val;
            var num= $("#number").val;
            var email = $("#email").val;
            var dataString = 'name'+name+'number'+num+'email'+email;
            $.ajax({
                type:'POST',
                data:dataString,
                url:'edit_ven.php',
                success:function(data) {
                    alert(data);
                }
            });
        });
        </script>

    </body>

</html>


//其他代码
函数删除记录（id）{
冒烟。确认（“是否要删除？”，函数（结果）{
如果（结果）
{
window.location.href='delete_ven.php？id='+id；
}
否则{
标题（“位置：venu view.php”）；
}});
}
$（文档）.ready（函数（）{
$（“#abc”）。单击（函数（）{
$（“#对话框确认”）。对话框({
莫代尔：是的，
宽度：400，
身高：400
});
});
});
$（“#提交”）。单击（功能（e）{
e、 预防默认值（）；
变量名称=$（“#名称”）.val；
var num=$（“#number”）.val；
var email=$（“#email”）.val；
var dataString='name'+name+'number'+num+'email'+email；
$.ajax({
类型：'POST'，
数据：dataString，
url:'edit_ven.php'，
成功：功能（数据）{
警报（数据）；
}
});
});

我对它进行了测试，有引号也有引号。这不是问题所在。与前面提到的其他评论一样，您的错误控制台中是否有错误？@RayaanKhan还删除了高度值（查看答案）后的逗号。这是带下划线的错误$（“#dialog confirm”）。dialog（{error:uncaughttypeerror:$（…）。dialog不是一个函数非常感谢您。我刚刚添加了它，它起了作用：）我已经测试了它有引号和没有引号。这不是问题所在。就像前面提到的其他评论一样，你的错误控制台中有错误吗？@RayaanKhan还删除了高度值（查看答案）后面的逗号这是带下划线的错误$（“#dialog confirm”）。dialog（{error:Uncaught Typeerror:$（…）.dialog不是一个函数。非常感谢。我刚刚添加了，它起作用了：）控制台上的错误是什么？？？确保

#abc

在页面上是唯一的错误是什么？控制台中的错误是什么？您的img是在页面加载之后动态添加的吗？下面是带下划线的错误$（“#dialog confirm”）。dialog（{error:Uncaught Typeerror:$（…）.dialog不是一个函数控制台上有什么错误？？？确保

#abc

在页面上是唯一的控制台中有什么错误？在页面加载后是否动态添加您的img