Использование узлов и функций Javascript - PullRequest
Новая
       0

Использование узлов и функций Javascript

0 голосов
/ 19 февраля 2012

У меня есть таблица с четырьмя строками, каждая с «id», и внутри каждой ссылки с текстом.

Я хочу изменить innerHTML по нажатой ссылке на следующую ссылку innerHTML.

Так что, если у меня есть это: 

ONE
TWO
THREE
FOUR

и я нажимаю на ДВА, например, результат должен быть: 

ONE
THREE 
TWO
FOUR

Как следует из моего кода, который уже меняет порядок двух первых ссылок, но он делает то же самое, если я нажимаю другую ссылку. 

<html>
<head>
<script type="text/javascript">
function change()
{
var link = document.getElementsByTagName("a");
var i = 0;
var aux = link[i].innerHTML;
link[i].innerHTML = link[i+1].innerHTML;
link[i+1].innerHTML = aux;
}
</script>
</head>
<body>
<table border="1">
<tr id="1"><td><a href="#" onclick="change()">ONE</a></td></tr>
<tr id="2"><td><a href="#" onclick="change()">TWO</a></td></tr>
<tr id="3"><td><a href="#" onclick="change()">THREE</a></td></tr>
<tr id="4"><td><a href="#" onclick="change()">FOUR</a></td></tr>
</table>
</body>
</html>

Я работал над этим весь день, и я не вижу, что еще я могу сделать. Я начинаю как с Java, так и с Javascript, поэтому использование массивов и функций DOM и Javascript является для меня новым.

Ответы [ 2 ]

0 голосов
/ 20 февраля 2012

Вы, кажется, хотите сделать что-то вроде: 

<style type="text/css">
.shifter {
  color: blue;
  text-decoration: underline;
  cursor: pointer;
}
</style>

<script>

function shiftRows(e) {
  var el = e.target || e.srcElement;
  var row, tbody;

  if (el.tagName.toLowerCase() == 'span' && el.className == 'shifter') {
    row = el.parentNode.parentNode;
    tbody = row.parentNode;

    if (row.rowIndex > 0) {
      tbody.insertBefore(row, tbody.rows[row.rowIndex - 1]);
    }
  } 
}

</script>

<table id="t0" onclick="shiftRows(event);">
  <tr><td><span class="shifter">0</span>
  <tr><td><span class="shifter">1</span>
  <tr><td><span class="shifter">2</span>
  <tr><td><span class="shifter">3</span>
</table>
0 голосов
/ 19 февраля 2012

Как код узнает, какая ссылка была нажата?Если вы этого не скажете, он не сможет сделать это магическим образом.

Прежде всего, удалите все эти атрибуты id.Они здесь не служат цели и приведут только к путанице.

Далее, передайте this в качестве первого аргумента change: onclick="change(this);" и function change(link) {...}.

Теперь переписайтеВаша функция change позволяет найти нужную ссылку для изменения link и выполнить обмен, как вы сейчас.

Удачи.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...