Javascript 如何从警报框中获取输入文本

我有一个表单，其中有手机号码的输入字段，姓名和电子邮件。我有两个按钮“添加”和“分组”。添加按钮“添加选定记录的新记录”。分组按钮用于在记录上创建一组选定字段。因此，当您单击“分组”按钮时，它将询问是否创建组。如果是，则它将创建一个名为0或1的组。但我想给出一些名称（用户应键入要提供的名称）到组。请告诉我如何做。这是和这是截图

这是jquery

var val = 0;
var groupTrCount = 0;
$(document).ready(function () {
    var obj={};
    $('#btn1').click(function () {
        if ($(".span4").val() != "") {
            $("#mytable").append('<tr id="mytr' + val + '"></tr>');
            $tr=$("#mytr" + val);
            $tr.append('<td class=\"cb\"><input type=\"checkbox\" value=\"yes\" name="mytr' + val + '" checked ></td>');
            $(".span4").each(function () {
                $tr.append("<td >" + $(this).val() + "</td>");
            });
            var arr={};
            name=($tr.find('td:eq(1)').text());
            email=($tr.find('td:eq(2)').text());
            mobile=($tr.find('td:eq(3)').text());
            arr['name']=name;arr['email']=email;arr['mobile']=mobile;
            obj[val]=arr;
            val++;
        } else {
            alert("please fill the form completely");
        }
    });
    $(document).on('click', '#btn2',function () {
        var creat_group = confirm("Do you want to creat a group??");
        if (creat_group) {
            console.log(obj);

            $("#groupsTable").append('<tr id="groupTr' + groupTrCount + '"></tr>');
            $tr=$("#groupTr" + groupTrCount);
            $tr.append("<td >" + groupTrCount + "</td>");
            var userColumn = "<ul>";
            $('#mytable tr').filter(':has(:checkbox:checked)').each(function() {
                var count=0;
                $(this).find('td').each(function() {
                    if(count == 1){

                        userColumn+= "<li>" + $(this).html() + "</li>" ;
                    }
                    count++;
                    });
            });
            userColumn+="<ul>";
            $tr.append("<td >" +userColumn+ "</td>");
        groupTrCount++;
        }        
    });
    $(document).on('change','#mytable input:checkbox',function () {
        if(!this.checked)
        {
            key=$(this).attr('name').replace('mytr','');
            alert(key);
            obj[key]=null;
        }
    });
});

var-val=0；
var-groupTrCount=0；
$（文档）.ready（函数（）{
var obj={}；
$（'#btn1'）。单击（函数（）{
如果（$（“.span4”）.val（）！=”）{
$（“#mytable”）。追加（“”）；
$tr=$（“#mytr”+val）；
$tr.append（“”）；
$（“.span4”）。每个（函数（）{
$tr.append（“+$（this.val（）+”）；
});
var arr={}；
name=（$tr.find（'td:eq（1）'）.text（））；
email=（$tr.find（'td:eq（2）'）.text（））；
mobile=（$tr.find（'td:eq（3）'）.text（））；
arr['name']=name；arr['email']=email；arr['mobile']=mobile；
obj[val]=arr；
val++；
}否则{
提醒（“请完整填写表格”）；
}
});
$（文档）。在（'click'，'btn2'，函数（）{
var creat_group=确认（“您想创建一个组吗？”）；
如果（创建组）{
控制台日志（obj）；
$（“#groupsTable”）。追加（“”）；
$tr=$（“#groupTr”+groupTrCount）；
$tr.append（“+groupTrCount+”）；
var userColumn=“
”；
$（'#mytable tr'）。筛选器（':has（：复选框：checked'）。每个（函数（）{
var计数=0；
$（this）.find（'td'）.each（function（）{
如果（计数=1）{
userColumn+=“
”+$（this.html（）+”
”；
}
计数++；
});
});
用户列+=“
”；
$tr.append（“+userColumn+”）；
groupTrCount++；
}        
});
$（document）.on（'change'，'#mytable输入：复选框'，函数（）{
如果（！this.checked）
{
key=$（this.attr（'name'）.replace（'mytr'，''）；
警报（键）；
obj[key]=null；
}
});
});

---

您只将

groupTrCount

添加为列文本，因此您将0、1…作为索引。您可以尝试以下操作

$tr.append("<td >Group: " + groupTrCount + "</td>");

$tr.append（“组：+groupTrCount+”）；

而不是

$tr.append("<td >" + groupTrCount + "</td>");

$("#groupsTable").append('<tr id="groupTr' + groupTrCount + '"></tr>');
    $tr=$("#groupTr" + groupTrCount);
    $tr.append("<td >Group:" + groupTrCount + "</td>"); // or you can use whatever name you want in place of "Group:"
    var userColumn = "<ul>";
    $('#mytable tr').filter(':has(:checkbox:checked)').each(function() {
      var count=0;
      $(this).find('td').each(function() {
         if(count == 1){
        userColumn+= "<li>" + $(this).html() + "</li>" ;
         }
         count++;
    });
});

$tr.append（“+groupTrCount+”）；
$（“#groupsTable”）。追加（“”）；
$tr=$（“#groupTr”+groupTrCount）；
$tr.append（“组：+groupTrCount+”）；//或者您可以使用您想要的任何名称来代替“组：”
var userColumn=“
”；
$（'#mytable tr'）。筛选器（':has（：复选框：checked'）。每个（函数（）{
var计数=0；
$（this）.find（'td'）.each（function（）{
如果（计数=1）{
userColumn+=“
”+$（this.html（）+”
”；
}
计数++；
});
});

更新

---

要使用自定义弹出窗口，您可以在页面上使用一个单独的div。在

CSS

的帮助下，将其设置为一个

覆盖图

。或者，您可以轻松地使用它。

如果您要添加一个命名组，请使用

提示符

而不是

确认

。这将打开一个弹出窗口，用户可以在其中输入组名字

$（文档）.on（'click'，'btn2'，函数（）{
var creat_group=prompt（“命名您的组”）；
如果（创建组）{
控制台日志（obj）；
$（“#groupsTable”）。追加（“”）；
$tr=$（“#groupTr”+groupTrCount）；
$tr.append（“+create_group+”）；
var userColumn=“
”；
$（'#mytable tr'）。筛选器（':has（：复选框：checked'）。每个（函数（）{
var计数=0；
$（this）.find（'td'）.each（function（）{
如果（计数=1）{
userColumn+=“
”+$（this.html（）+”
”；
}
计数++；
});
});
用户列+=“
”；
$tr.append（“+userColumn+”）；
groupTrCount++；
}        
});

更新小提琴：

var-val=0；
var-groupTrCount=0；
$（文档）.ready（函数（）{
var obj={}；
$（'#btn1'）。单击（函数（）{
如果（$（“.span4”）.val（）！=”）{
$（“#mytable”）。追加（“”）；
$tr=$（“#mytr”+val）；
$tr.append（“”）；
$（“.span4”）。每个（函数（）{
$tr.append（“+$（this.val（）+”）；
});
var arr={}；
name=（$tr.find（'td:eq（1）'）.text（））；
email=（$tr.find（'td:eq（2）'）.text（））；
mobile=（$tr.find（'td:eq（3）'）.text（））；
arr['name']=name；arr['email']=email；arr['mobile']=mobile；
obj[val]=arr；
val++；
}否则{
提醒（“请完整填写表格”）；
}
});
$（文档）。在（'click'，'btn2'，函数（）{
var creat_group=确认（“您想创建一个组吗？”）；
如果（创建组）{
控制台日志（obj）；
$tr.append（“+groupTrCount+”）；
$（“#groupsTable”）。追加（“”）；
$tr=$（“#groupTr”+groupTrCount）；
$tr.append（“组：+groupTrCount+”）；//或者您可以使用您想要的任何名称来代替“组：”
var userColumn=“
”；
$（'#mytable tr'）。筛选器（':has（：复选框：checked'）。每个（函数（）{
var计数=0；
$（this）.find（'td'）.each（function（）{
如果（计数=1）{
userColumn+=“
”+$（this.html（）+”
”；
}
计数++；
});
});;
用户列+=“
”；
$tr.append（“+userColumn+”）；
groupTrCount++；
}        
});
$（document）.on（'change'，'#mytable输入：复选框'，函数（）{
如果（！this.checked）
{
$(document).on('click', '#btn2',function () {
    var creat_group = prompt("Name your group??");
    if (creat_group) {
        console.log(obj);

        $("#groupsTable").append('<tr id="groupTr' + groupTrCount + '"></tr>');
        $tr=$("#groupTr" + groupTrCount);
        $tr.append("<td >" + creat_group + "</td>");
        var userColumn = "<ul>";
        $('#mytable tr').filter(':has(:checkbox:checked)').each(function() {
            var count=0;
            $(this).find('td').each(function() {
                if(count == 1){

                    userColumn+= "<li>" + $(this).html() + "</li>" ;
                }
                count++;
                });
        });
        userColumn+="<ul>";
        $tr.append("<td >" +userColumn+ "</td>");
    groupTrCount++;
    }        
});

var val = 0;
var groupTrCount = 0;
$(document).ready(function () {
    var obj={};
    $('#btn1').click(function () {
        if ($(".span4").val() != "") {
            $("#mytable").append('<tr id="mytr' + val + '"></tr>');
            $tr=$("#mytr" + val);
            $tr.append('<td class=\"cb\"><input type=\"checkbox\" value=\"yes\" name="mytr' + val + '" checked ></td>');
            $(".span4").each(function () {
                $tr.append("<td >" + $(this).val() + "</td>");
            });
            var arr={};
            name=($tr.find('td:eq(1)').text());
            email=($tr.find('td:eq(2)').text());
            mobile=($tr.find('td:eq(3)').text());
            arr['name']=name;arr['email']=email;arr['mobile']=mobile;
            obj[val]=arr;
            val++;
        } else {
            alert("please fill the form completely");
        }
    });
    $(document).on('click', '#btn2',function () {
        var creat_group = confirm("Do you want to creat a group??");
        if (creat_group) {
            console.log(obj);

            $tr.append("<td >" + groupTrCount + "</td>");

$("#groupsTable").append('<tr id="groupTr' + groupTrCount + '"></tr>');
    $tr=$("#groupTr" + groupTrCount);
    $tr.append("<td >Group:" + groupTrCount + "</td>"); // or you can use whatever name you want in place of "Group:"
    var userColumn = "<ul>";
    $('#mytable tr').filter(':has(:checkbox:checked)').each(function() {
      var count=0;
      $(this).find('td').each(function() {
         if(count == 1){
        userColumn+= "<li>" + $(this).html() + "</li>" ;
         }
         count++;
    });
});;
            userColumn+="<ul>";
            $tr.append("<td >" +userColumn+ "</td>");
        groupTrCount++;
        }        
    });
    $(document).on('change','#mytable input:checkbox',function () {
        if(!this.checked)
        {
            key=$(this).attr('name').replace('mytr','');
            alert(key);
            obj[key]=null;
        }
    });
});