Question

我有这段代码，我不知道如何从输入框中获取值。这是我的HTML代码：

        <div id = "login">
            <p>User <input type = "text" id = "username"></p>
            <p>Password <input type = "password" id = "password"></p>
            <button onclick = "login(?,?)">Log In</button>  
        </div>

这是我的Javascript代码：

function login(name, password){
    alert('Your username is ' + name + ' and your password is ' + password);
};

如何从输入框中获取值？提前谢谢。

Answer 1

使用Javascript：

function login(){

    name = document.getElementById('username');
    password = document.getElementById('password');
    alert('Your username is ' + name + ' and your password is ' + password);
};

HTML中的

：

<button onclick = "login()">Log In</button>

Answer 2

<强>编辑：感谢@sajalsuraj

<div id = "login">
    <p>User <input type = "text" id = "username"></p>
    <p>Password <input type = "password" id = "password"></p>
    <button onclick = "login()">Log In</button>  
</div>


function login(){
    var name = document.getElementById('username').value;
    var password = document.getElementById('password').value;
    alert('Your username is ' + name + ' and your password is ' + password);
};

Answer 3

<div id = "login">
            <p>User <input type = "text" id = "username"></p>
            <p>Password <input type = "password" id = "password"></p>
            <button onclick = "login(document.getElementById('username').value, document.getElementById('password').value)">Log In</button>  
        </div>

Answer 4

修改@smoqadam回答，

function login(name, password){
   alert('Your username is ' + name + ' and your password is ' + password);
};

 name = document.getElementById('username').value;
 password = document.getElementById('password').value;
 login(name,password);

如果使用Jquery，

 function login(){
    $name = $('#username').val();
    $pass = $('#password').val();
    alert('UserName: '+$name+' Password: '+$pass);
  }

Answer 5

我建议不以这种方式绑定到事件。这是您尝试做的最低限度的一个更好的例子。我还建议使用原生的html form功能。请考虑阅读：https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/elements

＆＃13;

// add event listener to loginButton with handler, that will get username and password from html
document.getElementById('loginButton').addEventListener('click', function() {
  var username = document.getElementById('username').value;
  var password = document.getElementById('password').value;
  login(username, password);
  
});

// function to process login.
function login (username, password) {
  alert('username ' + username + '; password ' + password);
}

＆＃13;

<div>
    <p>User <input type="text" id="username" /></p>
    <p>Password <input type="password" id="password" /></p>
    <button id="loginButton">Log In</button>
</div>

＆＃13;

Answer 6

HTML：

<div id="login">
  <p>User <input type="text" id="username"></p>
  <p>Password <input type="password" id="password"></p>
  <button onclick="getData()">Log In</button>  
</div>

Javascript代码：

function getData() {
name = document.getElementById('username');
password = document.getElementById('password');
getLogin(name,password);
}    

function getLogin(name, password){
    Console.log('Your username is ' + name + ' and your password is ' + password);
};

Answer 7

更好的方法是在html代码中不包含JS代码，而只是从js代码引用登录按钮并向其添加事件。所以你以后可以利用缓存，这是一个例子：

- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {
    NSLog(@"collectionView=%@", collectionView);
    NSLog(@"cardscollectionView=%@", cardscollectionView);
    if (collectionView == cardscollectionView) {
        return 2;
    } else{
        return 1;
    }
}

Answer 8

你必须得到像这样的html元素的价值

的document.getElementById（ '用户名'）。值

function login(name, password){
  var name = document.getElementById('username').value;
  var password = document.getElementById('password').value;
  alert('Your username is ' + name + ' and your password is ' + password);
};

#login{
  width:100%;
  padding:10px 50px;
}
label{
width:70px;
  display:inline-block;
}

<div id="login">
  <p><label>User</label> <input type="text" id="username"></p>
  <p><label>Password</label> <input type = "password" id = "password"></p>
  <button onclick="login();">Log In</button>  
        </div>

如何从输入框中获取值

8 个答案: