Question

实际上每次点击重定向到anadirNota()的按钮时，我都会有一个带有笔记的HTML学生表单。从输入txtNota获取值并添加到范围spanNotas。当您单击anadirAlumno()按钮时，将表单的值添加到表的新行，但使用spanNotas（作为数组）来计算方法obtenerMedia()。 我的问题是：我如何将de spanNotas元素作为Int数组运行？

示例：

Nombre：Al Apellido：巫统 Notas：[2,6,8]

当我点击de“añadiralumno”按钮时，插入行：

Nombre | Apellidos | Media
Al     | Umno      | 5,33

HTML代码：

 <body>
        Nombre:<input id="txtNombre" type="text" />
        &nbsp;&nbsp;&nbsp;
        Apellido:<input id="txtApellido" type="text" />
        &nbsp;&nbsp;&nbsp;
        Notas:&nbsp;[<span id="spanNotas"></span>]
        <br/>
        Nota:<input id="txtNota" type="text" />
        &nbsp;
        <input type="button" value="Añadir nota" onclick="anadirNota()"/>
        <br/><br/>
        <input type="button" value="Añadir alumno" />
        <br/><br/>
        <table id="tablaAlumnos">
            <tr>
                <th>Nombre</th>
                <th>Apellido</th>
                <th>Media</th>
            </tr>
        </table>
    </body>

Javascript代码：

    function anadirNota() {
        var nota = parseInt(document.getElementById("txtNota").value);
        console.log(nota);
        if(!isNaN(nota)) {

            var listaNotas = document.getElementById("spanNotas").innerHTML;
            console.log(listaNotas);
            listaNotas += nota;
            console.log(listaNotas);
            document.getElementById("spanNotas").innerHTML=listaNotas+", ";
        } else {
            alert("El valor del campo nota no es válido")
        }
    }

    function anadirAlumno() {

        var nombre = document.getElementById("txtNombre").value;
        var apellido = document.getElementById("txtApellido").value;
        var notas = document.getElementById("spanNotas").innerHTML;

        if(nombre != "" || apellido != "" || notas.isEmpty ) {

            var Alumno1 = new Alumno(nombre, apellido, notas);
            var notaMedia = Alumno1.obtenerMedia();

            console.log(Alumno1);

            var table = document.getElementById("tablaAlumnos");
            fila = table.insertRow(table.length);
            fila.insertCell (0).innerHTML=nombre;
            fila.insertCell (1).innerHTML=apellido;
            fila.insertCell (2).innerHTML=notaMedia;
        } else {
            alert("Los datos del alumno no son correctos")
        }
    }

    var Alumno = function(nombre, apellido, notas)
    {
        this.nombre = nombre;
        this.apellido = apellido;
        this.notas = notas;

        this.obtenerMedia = function() {
            var media = 0;

            for(i = 0; i < this.notas.length; i++)
                media += this.notas[i];

            media /= this.notas.length;
            return media.toFixed(2);
        };
    };
</script>

Answer 1

正如 lolka_bolka 所说：listaNota包含一个字符串（例如＆＃34; 2,4,5和＃34;）所以通过在每个,分割来使它成为一个数组。 .map()函数将所有部分转换为数字。最后一步，数组将转换回.join();

的字符串

if(!isNaN(nota)) { 
    var listaNotas = document.getElementById("spanNotas").innerHTML;
        console.log(listaNotas);
    var notaArray = listaNotas.split(',').map(function(n) {return parseFloat(n);})
        console.log(notaArray);
    notaArray.push(nota);
        console.log(notaArray);
    document.getElementById("spanNotas").innerHTML = notaArray.join(', ');
}

获取跨度HTML值以作为数组运行

1 个答案: