Question

我一直在尝试将登录功能作为学习Javascript的一种方式。我似乎无法让它完全发挥作用。除了＆＃34;你已登录＆＃34;我可以获得所有警报。显示。

我已对其进行了编辑，因此现在该函数接收到userInput，但它仅适用于＆＃34; Harry＆＃34;其他用户名不起作用。

＆＃13;

var users = ["Harry", "Julie", "Dewey", 5869];

function login() {

  var userInput = document.getElementById("userInput").value;
  if (userInput.length === 0) {
    alert('Please enter Username');
    return;
  } else {
    checkUserInput(userInput);
  }
};

function checkUserInput(userInput) {
  for (var i = 0; i < users.length; i++) {
    console.log(users[i]);
    if (users[i] === userInput) {
      alert("You are logged in");
      return;
    } else {
      alert("Invalid username, please try again or if you are new register");
      return;
    }
  }
};

＆＃13;

<h1>Javascript Example</h1>

<input type="text" id="userInput" />
<input type="button" value="Submit" onclick="login()" />

＆＃13;

Answer 1

首先，您需要在userInput函数中获得checkUserInput。您正在通过它checkUserInput(userInput);但未接收。

所以：

function checkUserInput(userInput){…

此警报并立即返回用户与数组中的第一个不匹配。而是使用indexOf，但请注意它与IE＆lt; 9

不兼容

function checkUserInput(userInput){
  if(users.indexOf(userInput) > -1){
    alert("You are logged in");
    return;
  }
  else{
    alert("Invalid username, please try again or if you are new register");
    return;           
  }                
};

indexOf是检查数组中是否存在元素的更好方法。

Answer 2

您需要更新添加输入参数＆＃39; userInput ＆＃39;到 checkUserInput 方法。当您在jsfiddle代码的第15行传递 checkUserInput（ userInput ）; 时。

SELECT ?subject ?object
    WHERE { 
?subject rdfs:subClassOf?object.
filter regex (?object ,"CSProjects","i").
}

Answer 3

首先，永远不要使用客户端JavaScript来实现任何类型的登录功能，因为它充满了安全问题。也就是说，您可以采取一些措施来改进代码。

HTML：

<form>
  <input type="text" id="userInput" />
  <input type="submit" value="Submit" />
</form>

使用表单并删除内联事件侦听器。

JS：

function login(e) {
  e.preventDefault();
  var input = userInput.value;
  if (input === '') {
    alert('Please enter Username');
    return;
  }

  checkUserInput(input);
}

function checkUserInput(name) {
  if (users.includes(name)){
    alert("You are logged in");
  } else {
    alert("Invalid username, please try again or if you are new register");
  }
}

var form = document.forms[0];
var userInput = document.getElementById("userInput");
var users = ["Harry", "Julie", "Dewey", "5869"];
form.addEventListener('submit', login);

使用addEventListener附加侦听器。将调用移至getElementById以避免重复查询DOM。

在login函数中，您可能会丢失else语句的if部分。在checkUserInput中，您可以使用新的includes方法来检查名称是否包含在数组中，尽管浏览器对此的支持并不是很好（如果这是一个学习，这可能无关紧要运动）。

如您所见，我将用户输入文本字段的值传递给checkUserInput的调用。这是您发布的代码无法正常工作的主要原因。

HTH。

基本登录功能（Javascript）

3 个答案: