Question

所以我做了这个导航菜单，从对象属性获取值，但是当我缺少对象属性时，我希望javascript给我提醒信息。我尝试了以下代码，但它似乎没有起作用：

 /*
    if(menu[nextMenu].menuList=="undefined"){
            alert('error');
    }
    */

我正在使用jQuery。

    <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>this is the title</title>
<style type="text/css">

ul li{
    list-style:none;
    padding:10px;
    background:grey;
    color:white;    
}
ul li:hover{
    background:#484848;
    cursor:pointer;
}

ul{
    width:200px;
}
</style>
</head>
<body>
<div class="menu">
    <ul>
    </ul>
</div>

<button class="back-btn">Back</button> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script> 
var menuNr = 0;
var menuListNr = 0;
var menuIndex = 0;
var nextMenu = 0;
var history1 = [0];

var menu = [{
    menuName: 'menu list',
    menuList: ['new game', 'options', 'credit'], // MENU LIST 0
    menuIndex: [1, 2, 3]
  }, {
    menuName: 'new game',
    menuList: ['easy', 'normal', 'hard'], // NEW GAME 1
    menuIndex: [4, 5, 6]
  }, {
    menuName: 'options',
    menuList: ['sound', 'video', 'keyboard'], // OPTIONS 2
    menuIndex: [7, 8, 9]
  }, {
    menuName: 'credit',
    menuList: ['designers', 'voiceactors', 'programmers'], // CREDIT 3
    menuIndex: [10, 11, 12]
  }, {
  }, {
  }, {
  }, {
  }, {
    menuName: 'credit',
    menuList: ['brightness', 'color'], // VIDEO 8
    menuIndex: [10, 11, 12]
  }
];

for (var i = 0; i < menu[menuNr].menuList.length; i++) {
  $('.menu ul').append('<li>' + menu[menuNr].menuList[i] + '</li>');
}

$('.menu ul').on('click', 'li', function() {
  var selectedIndex = $(this).index();
  nextMenu = menu[menuNr].menuIndex[selectedIndex];

  $('.menu ul').empty();

  for (var i = 0; i < menu[nextMenu].menuList.length; i++) {
    $('.menu ul').append('<li>' + menu[nextMenu].menuList[i] + '</li>');
  }
  menuNr = nextMenu;

  history1.push(menuNr);
  console.log(history1);
});

$('.back-btn').on('click', function() {
  var x = history1.length;
  x -= 2;

  if (x < 0) {
    x = 0;
    return;
  }

  menuNr = x;
  history1.pop();

  $('.menu ul').empty();

  for (var i = 0; i < menu[menuNr].menuList.length; i++) {
    $('.menu ul').append('<li>' + menu[menuNr].menuList[i] + '</li>');
  }
});
</script>
</body>
</html>

Answer 1

我想，你想写

if(!menu[nextMenu] || typeof menu[nextMenu].menuList === "undefined"){
  alert('error');
}

它检查菜单属性是否存在，如果不存在 - 它会跳过休息。然后它检查menuList是否未定义。

Answer 2

尝试：

if(menu[nextMenu].menuList=="undefined" || 
menu[nextMenu].menuList == "" ||  
menu[nextMenu].menuList=="null"){
        alert('error');
}

如果您尝试定位不存在的DOM节点，并非所有浏览器都会返回相同的内容。有些会返回null，有些是“未识别”，有些则是空白空间。

您还可以测试DOM节点长度。如果它不存在，它将返回0.

Javascript对象检查不起作用

2 个答案: