如何根据我的列表迭代我的表 TR 以及如何划分登录 ID 和密码,如何在表中打印这两个值



var login = document.getElementById('loginIdVal');
var password = document.getElementById('loginIdVal');
function add() {
  var list = [];
  if (login.value && password.value != '') {
    list.push(login.value);
    alert(push[0]);
  }
}
<!DOCTYPE html>
<html>
<body>
  <form methode="post">
    <table style="width:60%;margin-left:20%; margin-top:50px">
      <tr height="25">
        <td width="150" align="right">Login ID</td>
        <td><input type="text" style="width:100%;" id="loginIdVal" /></td>
      </tr>
      <tr height="25">
        <td align="right">Password</td>
        <td><input type="password" style="width:100%;" id="passwordIdVal" /></td>
      </tr>
      <tr height="25">
        <td align="right"></td>
        <td><button onclick="add()">Add</button></td>
      </tr>
    </table>
    <table border="1" style="width:60%;margin-left:20%; margin-top:200;">
      <tr height="25">
        <th width="150">Login ID</td>
          <th>Password</th>
      </tr>
      <tr height="25">
        <td align="right"></td>
        <td></td>
      </tr>
    </table>
    </script>
  </form>
</body>
</html>

我的要求是一旦用户直接在表单中输入任何凭据,其推送列表,登录ID和密码分开并添加到带有登录ID和密码的作者表中,如果没有用户那么,我需要显示空表其他明智的行长度等于用户的长度,并且一个用户只能有一条记录。

更正这些错误:

var login = document.getElementById('loginIdVal');
var password = document.getElementById('passwordIdVal'); // not 'loginIdVal'
function add(){
    var list = [];
    if(login.value && password.value !='s') {
        list.push(login.value);
        alert(push[0]); // WHAT IS PUSH ??? is it list method ??? seriously RTFM
    }
}

还有这些:

function add() {
    var login, password;
    login = document.getElementById('loginIdVal');
    password = document.getElementById('passwordIdVal');
    addLine(login.value, password.value);
    login.value = '';
    password.value = '';
}
function addLine(login, password) {
    var $table;
    $table = document.getElementById('submited-table');
    if( login && password != 's' ) {
        var $line = document.createElement('tr'), 
            $cellLogin = document.createElement('td'), 
            $cellPassword = document.createElement('td');
        $cellLogin.textContent = login;
        $cellPassword.textContent = password;
        $line.appendChild( $cellLogin );
        $line.appendChild( $cellPassword );
        $table.appendChild( $line );
    }
}
function print() {
  document.getElementById('result').textContent = JSON.stringify( getList() );
}
function getList(){
    var list = [];
    document.querySelectorAll('#submited-table tr:not(:first-child)').forEach(function($line){
        list.push( {
            'login':$line.firstChild.textContent,
            'password':$line.lastChild.textContent
        });
    });
    return list;
}
<!DOCTYPE html>
<html>
<body>
    <form method="post" action="javascript:void(0)">
        <table style="width:60%;margin-left:20%; margin-top:50px">
            <tr height="25">
                <td width="150" align="right">Login ID</td>
                <td>
                    <input type="text" style="width:100%;" id="loginIdVal"/>
                </td>
            </tr>
            <tr height="25">
                <td align="right">Password</td>
                <td>
                    <input type="password" style="width:100%;" id="passwordIdVal"/>
                </td>
            </tr>
            <tr height="25">
                <td align="right"></td>
                <td><button onclick="add()">Add</button></td>
            </tr>
        </table>
    </form>
    <table id="submited-table" border="1" style="width:60%;margin-left:20%; margin-top:200;" >
        <tr height="25">
            <th width="150">Login ID</td>
            <th>Password</th>
        </tr>
    </table>
    <pre id="result"></pre>
    <button onclick='print()'>Print Data</button>
</body>
</html>

相关内容

最新更新