0

HTMLドキュメントに2つのリストがあります。両方のリストに異なるデータが含まれています。

私の取得は、ユーザーが1つのリストでアイテムを選択した場合、同じアイテムが同じ場所の別のリストに追加されるはずです。

例えば。

list 1  - Hi, Hello       
list 2  - Thanks, Welcome

"Hi"ユーザーがList1で選択し、次にList2で同じ位置にあるものに"Thanks"置き換えられたとします。"Hi"list2[0]

私は、Javaスクリプトを使用してこれを達成できることをinternateで読みましたが、まだ解決策がありません。

私を助けてください。

ありがとう

4

1 に答える 1

0

マークアップが次のようになっているとします。

<div>
  <ul id='list-1'>
    <li>Hi</li>
    <li>Hello</li>
  </ul>
</div>

<div>
  <ul id='list-2'>
    <li>Thanks,</li>
    <li>Welcome</li>
 </ul>
</div>

そして、次の JavaScript があります。

まず、2 つのリスト要素を選択します。

var listOne = document.getElementById('list-1')
   ,listTwo = document.getElementById('list-2');

次に、これらの要素の子でリスト アイテムを探します。

var listOneItems = listOne.getElementsByTagName('li') //returns an array
   ,listTwoItems = listTwo.getElementsByTagName('li');

次に、最初のリストのリスト アイテムをクリックしたときに実行するアクションを設定します。

for(var i=0; i<listOneItems.length; i++){
 /*we use swap.call so that the function is in the context of this
   list item*/
 listOneItems[i].onclick = swap.call(listOneItems[i], i);   
}

swap次に、関数を定義する必要があります。

/*this function returns the listener for the element, using a closure
  to bind the correct elements*/
function swap(i){
  var elem = this;
  return function(){
    listTwoItems[i].innerHTML = elem.innerHTML;  
  }
}

ここで実行されているのを見ることができます

于 2013-01-14T07:16:10.863 に答える