Question

我正在创建3个jsp页面。每个页面中有4个具有不同id的框（即第1页中的box1，box2，box3，box4;第2页中的box5，box6，box7，box8;第3页中的box9，box10，box11，box12）。以下是第1页中的示例代码：

<div class="dragableBox" id="box1">CAT</div>
<div class="dragableBox" id="box2">DOG</div>
<div class="dragableBox" id="box3">HORSE</div>
<div class="dragableBox" id="box4">TIGER</div>

在每个页面中还有一个脚本。在脚本中，我故意使用上面的所有id作为函数的参数。以下是第1页中的示例代码：

dragDropObj.addSource('box1',true);
dragDropObj.addSource('box2',true);
dragDropObj.addSource('box3',true); 
dragDropObj.addSource('box4',true); 
dragDropObj.addSource('box5',true); 
dragDropObj.addSource('box6',true); 
dragDropObj.addSource('box7',true); 
dragDropObj.addSource('box8',true); 
dragDropObj.addSource('box9',true); 
dragDropObj.addSource('box10',true);    
dragDropObj.addSource('box11',true);    
dragDropObj.addSource('box12',true);

我必须这样做，因为据我所知，这是我的程序工作的唯一方法。我遇到的问题是每次程序启动时都会出现警告：＆＃34; id box5的源元素不存在＆＃34;

虽然程序仍能正常使用此警告，但我仍想消除警告。

我的问题是：如何阻止这种警告出现？ HTML中是否存在一种错误捕获方法？

Answer 1

if (document.getElementById('box1')){
    dragDropObj.addSource('box1',true);
    dragDropObj.addSource('box2',true);
    dragDropObj.addSource('box3',true); 
    dragDropObj.addSource('box4',true);
}
if (document.getElementById('box5')){
    dragDropObj.addSource('box5',true);
    dragDropObj.addSource('box6',true);
    dragDropObj.addSource('box7',true); 
    dragDropObj.addSource('box8',true);
}
if (document.getElementById('box9')){
    dragDropObj.addSource('box9',true);
    dragDropObj.addSource('box10',true);
    dragDropObj.addSource('box11',true); 
    dragDropObj.addSource('box12',true);
}

编辑：

更好的解决方案：

groupFirstMember = 1;
if (document.getElementById('box5')){
    groupFirstMember = 5;
}
else if (document.getElementById('box9')){
    groupFirstMember = 9;
}

for(i=0;i<4;i++){
    dragDropObj.addSource("box"+str(groupFirstMember+i),true);
}

Answer 2

在添加元素之前检查元素是否存在。

if (typeof document.getElementById('box5') !== 'undefined'){
    // continue
}

Answer 3

试试这个：这将抓住页面上的所有'dragableBox'并运行'dragDropObj.addSource（...，true）;'如果他们有一个不使用JQuery的id = box [x]：

boxes = document.getElementsByClassName('dragableBox');
for (i=0; i < boxes.length; ++i) {
  var id = boxes[i].id;
  if(id.substring(0,3)==='box')
    dragDropObj.addSource(id,true);  
}

消除HTML中的警告

3 个答案: