javascript - 将查询代码与许多不同的 div 连接

Question

如果我有 5 个 div

<div id="" class=""> Div11 </div>
<div id="" class=""> Div12 </div>
<div id="" class=""> Div13 </div>
<div id="" class=""> Div14 </div>
<div id="" class=""> Div15 </div>

和类似的 jquery 代码:

单击某个 div 将其隐藏。

现在当我在 jquery 中说 $("DIV").click(function(){ $("DIV").hide(); });

我将其命名为 DIV，这样我就可以问你以下问题:

1. ID 或 CLASS 是否与所有其他 ID 或 CLASS 相同，而另一个则不同。
2. 如果 ID 不同，并且我有第一个 div id="div1" 和第二个 id="div2" 直到最后，我如何将查询连接到每个其中一个？

我尝试过，但它只适用于一个 div...就像更好的问题:

如果我在页面加载时将某些文本区域设置为隐藏在 jquery 中。在 div 上单击它需要显示...我的脚本仅适用于 1 个 div，其他则不然，并且文本区域没有按应有的方式隐藏。

更新:

我真正的东西是我有 php 文件和 mysql 数据库

mysql 数据库包含名字、id 和姓氏 它有 10 个名字

在我的 php 文件中，我有:

$sql = "SELECT * FROM names";
$result = $con->query($sql);

if ($result->num_rows > 0) {

    while($row = $result->fetch_assoc()) {
    $fname = $row['firstname'];
    $id = $row['id'];
            echo $fname."

            <textarea id='div".$id."' class='divsss'>Enter last name:</textarea>

";

    }

}

然后我有 jquery 代码:

<script type="text/javascript">
        $(document).ready(function() {


                $('.divsss').keypress(function(event) {

                var key = (event.keyCode ? event.keyCode : event.which);
                if (key == 13) {

                    var lname = $('.divsss').val();

                    var forid = '<?php echo $id; ?>';

                    $.ajax({
                        method: "POST",
                        url: "intodb.php",
                        data: {ln: lname, fi: forid},
                        success: function(status) {
                        alert("lname: " + lname + "for id: " + forid);
                            $('.divsss').val('');

                        }

                    });
                    };
                }); 

        });
    </script>

它不起作用，但是当我将其更改为具有相同 id 的 ids 时，它仅适用于第一个输出，它的值为 0 或 1。但是当我按类尝试时，它不起作用。 在 intodb.php 中，我刚刚更新了数据库...

Answer 1

关于您的问题

Is ID or CLASS one that is going to be same as all others and the other one different.

id根据定义，属性应该是唯一的，并且可以用于标识 DOM 中的特定元素。 class另一方面，属性可以共享多个元素，并且通常用于设置元素的样式。

If ID is different and if i have first div id="div1" and second id="div2" and till last, how can I connect query to every single one of them?

您可以通过多种方式来完成此任务。 jQuery 支持多种基于属性的选择器，因此您可以轻松定位具有“以 div 开头”的 id 的每个元素，如下所示:

// This would hide any elements that have an ID that starts with "div"
$('[id^="div"]').hide();

同样，您也可以将 CSS 类应用于所有这些元素来对它们进行分组并以这种方式选择它们:

<div class='your-class'></div>
<div class='your-class'></div>
<div class='your-class'></div>

连同:

// This would hide any elements that have the class "your-class"
$('.your-class').hide();

关于您的代码

对于您的实际代码，您需要确保正确确定您在 keypress 事件中尝试执行的操作的范围:

// When a key is pressed within this element (presumably a <textarea> or <input>
$('.divsss').keypress(function(event) {
        // Store a reference to this for your AJAX callback
        var _self = $(this);
        // Get the key
        var key = (event.keyCode ? event.keyCode : event.which); 
        // If it was enter
        if (key == 13) {
            // Get the last name (of this element), using $(this)
            var lname = $(this).val();
            // Get an id predefined by your server-side PHP
            var forid = '<?php echo $id; ?>';
            // Make your AJAX post
            $.post('intodb.php',{ln: lname, fi: forid}, function(status){
                    alert("lname: " + lname + "for id: " + forid);
                    _self.val('');
            });
});