Drag and drop

@linkoln_737 · Регистрация: 19.03.2013

Студворк — интернет-сервис помощи студентам

Помогите найти ошибку

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<html>
<head>
<script>
 
var ball = document.getElementById('ball');
 
ball.onmousedown = function(e) {
  var self = this;
  e = fixEvent(e);
  this.style.position = 'absolute';
  moveAt(e);
 
  document.body.appendChild(this);
 
  this.style.zIndex = 1000;
 
  function moveAt(e) {
    self.style.left = e.pageX-25+'px';
    self.style.top = e.pageY-25+'px';
   }
 
  document.onmousemove = function(e) {
 
    e = fixEvent(e);
 
    moveAt(e);
 
  }
 
  this.onmouseup = function() {
 
    document.onmousemove = self.onmouseup = null;
 
  }
 
}
ball.ondragstart = function() {
  return false;
};
</script>
</head>
<body>
<input type="button" id="ball" value="button"/>
</body>
</html>

хром пишет Uncaught TypeError: Cannot set property 'onmousedown' of null на эту строчку ball.onmousedown = function(e) {

@ludmila-sv · 17.10.2014, 00:23

А сама-то функция fixEvent где?
Наверно, Вы вот это имели в виду http://learn.javascript.ru/fixevent
Так ее надо в код включить, она не встроенная.

@Thisman · 17.10.2014, 04:44

linkoln_737, fixEvent - лишь кроссбраузерное создание объекта событий. Можно и без нее, но тогда не везбе работать будет ( ie ) , а если с ней, то и ее определить нужно

@kalabuni · 17.10.2014, 08:42

браузер обрабатывает код последовательно
когда вы пишете в коде document.getElementById('ball'), вы должны быть уверены, что браузер уже прочитал тег <input id="ball">

@linkoln_737 · 17.10.2014, 15:55 **[ТС]**

kalabuni, лучше скрипт сделать в конце?

Добавлено через 3 минуты
Thisman, то есть ее можно удалить?

@kalabuni · 17.10.2014, 16:18

linkoln_737, необязательно "в конце", можно в любом месте, но после тега <input id="ball">

либо "заверните" код в функцию, запускаемую по onload окна

@linkoln_737 · 17.10.2014, 16:19 **[ТС]**

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<html>
<head>
 
</head>
<body>
<input type="button" id="ball" value="button"/>
<script>
 
var ball = document.getElementById('ball');
 
ball.onmousedown = function(e) {
  var self = this;
  e = fixEvent(e);
  this.style.position = 'absolute';
  moveAt(e);
 
  document.body.appendChild(this);
 
  this.style.zIndex = 1000;
 
  function moveAt(e) {
    self.style.left = e.pageX-25+'px';
    self.style.top = e.pageY-25+'px';
   }
 
  document.onmousemove = function(e) {
 
    e = fixEvent(e);
 
    moveAt(e);
 
  }
 
  this.onmouseup = function() {
 
    document.onmousemove = self.onmouseup = null;
 
  }
 
}
ball.ondragstart = function() {
  return false;
};
</script>
</body>
</html>

так?

Новые блоги и статьи Все статьи Все блоги /
Доступность команды формы по условию Maks 07.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: сделать доступной кнопку (команда формы "ЗавершитьСписание") при. . .	Уведомление о неверно выбранном значении справочника Maks 06.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "НарядПутевка", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если в документе выбран неверный склад. . .	Установка Qt Creator для C и C++: ставим среду, CMake и MinGW без фреймворка Qt 8Observer8 05.04.2026 Среду разработки Qt Creator можно установить без фреймворка Qt. Есть отдельный репозиторий для этой среды: https:/ / github. com/ qt-creator/ qt-creator, где можно скачать установщик, на вкладке Releases:. . .	AkelPad-скрипты, структуры, и немного лирики.. testuser2 05.04.2026 Такая программа, как AkelPad существует уже давно, и также давно существуют скрипты под нее. Тем не менее, прога живет, периодически что-то не спеша дополняется, улучшается. Что меня в первую очередь. . .
Отображение реквизитов в документе по условию и контроль их заполнения Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеСпецтехники", разработанного в конфигурации КА2. Данный документ берёт данные из другого нетипового документа. . .	Фото всей Земли с борта корабля Orion миссии Artemis II kumehtar 04.04.2026 Это первое подобное фото сделанное человеком за 50 лет. Снимок называют новым вариантом легендарной фотографии «The Blue Marble» 1972 года, сделанной с борта корабля «Аполлон-17». Новое фото. . .	Вывод диалогового окна перед закрытием, если документ не проведён Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать программный контроль на предмет проведения документа. . .	Программный контроль заполнения реквизитов табличной части документа Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: 1. Реализовать контроль заполнения реквизита. . .

@ludmila-sv 279 / 279 / 62 Регистрация: 28.08.2014 Сообщений: 432
	17.10.2014, 00:23
	А сама-то функция fixEvent где? Наверно, Вы вот это имели в виду http://learn.javascript.ru/fixevent Так ее надо в код включить, она не встроенная. 0

@Thisman Модератор 771 / 352 / 142 Регистрация: 17.07.2013 Сообщений: 992
	17.10.2014, 04:44
	linkoln_737, fixEvent - лишь кроссбраузерное создание объекта событий. Можно и без нее, но тогда не везбе работать будет ( ie ) , а если с ней, то и ее определить нужно 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	17.10.2014, 08:42
	браузер обрабатывает код последовательно когда вы пишете в коде document.getElementById('ball'), вы должны быть уверены, что браузер уже прочитал тег <input id="ball"> 0

@linkoln_737 19 / 19 / 13 Регистрация: 19.03.2013 Сообщений: 423
	17.10.2014, 15:55 [ТС]
	kalabuni, лучше скрипт сделать в конце? Добавлено через 3 минуты Thisman, то есть ее можно удалить? 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	17.10.2014, 16:18
	linkoln_737, необязательно "в конце", можно в любом месте, но после тега <input id="ball"> либо "заверните" код в функцию, запускаемую по onload окна 0