Форум программистов, компьютерный форум, киберфорум
jQuery
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.78/18: Рейтинг темы: голосов - 18, средняя оценка - 4.78
1 / 1 / 0
Регистрация: 08.07.2015
Сообщений: 20

Не срабатывает .click на кнопке, созданной после загрузки страницы (ДОМа)

08.07.2015, 21:35. Показов 3334. Ответов 7
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Срабатывает клик на кнопке, которая загружается со страницей строка - 5 JavaScript
Не срабатывает созданная после загрузки - строка 55 JavaScript (создаю в строках - 31-36) JavaScript
Пробовал в строке 55 писать: $('#submit_code').on('click', function (e) {..... тоже не срабатывает

Работает только если при создании укажу onclick="имяФункции" и соответственно вместо
$('#submit_code').on('click', function (e) {.... пишу function имяФункции({ .....

Я только начинаю изучать JS, но очень хочется использовать Jquery. Подскажите, что написать, что бы и второй .click заработал?



HTML5
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
<form class="form-horizontal" role="form" action="/user/msisdn" method="post">
    <input type="hidden" name="do" value="1">
 
    <div class="form-group">
        <label for="msisdn" class="col-sm-2 control-label">Ваш номер телефона</label>
 
        <div class="col-sm-1">
            <select class="form-control" name="countryCode">
                <option value="+7" selected id="countryCode">+7</option>
            </select>
        </div>
        <div class="col-sm-9">
            <input type="tel" pattern="^[\s\d\-\(\)]+$" class="form-control" id="msisdn" name="msisdn"
                   placeholder="Ваш номер телефона " value="{{msisdn}}">
            <span class="help-block"><small>Введите телефон в формате &quot;000 000-00-00&quot;, без кода страны.
                Пробелы, дефисы и скобки необязательны.
            </small></span>
        </div>
    </div>
</form>
<footer class="col-sm-offset-2 col-sm-10">
    <div id="dialogue">
        <input type="submit" id="saveMsisdn" class="btn btn-success" value="Сохранить">
    </div>
</footer>
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
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
<script type="text/javascript">
    $(function () {
        var msisdn_acting = $("input#msisdn").val();
        var countryCode_acting = $("option#countryCode").val();
        $('#saveMsisdn').click(function (e) {
            var msisdn = $("input#msisdn").val();
            var countryCode = $("option#countryCode").val();
            if (/^[\s\d\-\(\)]+$/.test(msisdn)) {
                if (msisdn_acting !== msisdn || countryCode_acting !== countryCode) {
                    if (confirm('Вы хотите изменить номер телефона?')) {
                        $.ajax({
                            url: '/user/sendsms.json',
                            type: 'POST',
                            data: {
                                countryCode: countryCode,
                                misdn: msisdn
                            }
                        })
                                .done(function (data) {
                                    if (data.result) {
                                        alert('На Ваш новый номер телефона отправлено SMS-сообщение с кодом подтверждения.');
                                        alert(data.confirm);
                                        $('<input/>', {
                                            type: 'text',
                                            id: 'input_code',
                                            name: 'codeconfirmation',
                                            placeholder: "Код подтверждения ",
                                            autofocus: '',
                                            value: ''
                                        }).appendTo('#dialogue');
                                        $('<input/>', {
                                            type: 'submit',
                                            id: 'submit_code',
                                            value: 'Отправить',
                                            class: 'btn btn-success'
                                        }).appendTo('#dialogue');
                                        $("#saveMsisdn").remove();
                                    }
                                    else {
                                        var status = (data.statussend !== 'accepted') ? data.statussend : data.statussms;
                                        alert(status);
                                    }
                                })
                                .fail(function () {
                                    alert('Ошибка. Сообщение не отправлено. Обратитесь к администрации сайта.');
                                });
                    }
                }
            }
            else {
                alert('Не верный формат номера телефона')
            }
        });
 
        $('#submit_code').click(function (e) {
            var codeconfirmation = document.getElementById('input_code').value;
            var msisdn = $("input#msisdn").val();
            var countryCode = $("option#countryCode").val();
            $.ajax({
                url: '/user/ConfirmCode.json',
                type: 'POST',
                data: {codeconfirmation: codeconfirmation}
            })
                    .done(function (data) {
                        if (data.result) {
                            $("#input_code").remove();
                            $("#submit_code").remove();
                            $('<input/>', {
                                type: 'submit',
                                id: 'saveMsisdn',
                                value: 'Сохранить',
                                class: 'btn btn-success'
                            }).appendTo('#dialogue');
 
                            $.ajax({
                                url: '/user/msisdn/',
                                type: 'POST',
                                data: {
                                    countryCode: countryCode,
                                    msisdn: msisdn,
                                    do: '1'
                                }
                            })
                                    .done(function (save) {
                                        alert('Новый номер телефона успешно сохранён.');
                                    })
                                    .fail(function (save) {
                                        alert('Ошибка сохранения данных');
                                    });
                        }
                        else {
                            alert('Не правильно введён код!');
                        }
                    })
                    .fail(function (data) {
                        alert('Ошибка подтверждения кода. Попробуте ещё раз');
                    });
        });
    });
</script>
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
08.07.2015, 21:35
Ответы с готовыми решениями:

Не срабатывает скрипт после загрузки страницы
$(document).ready(function () { $.ajax({ type: 'POST', url: 'load.php', data: 'page=main', ...

Не срабатывает click(), после ajax запроса
есть такой код : $(&quot;div#timezone&quot;).on(&quot;click&quot;, function(e){ if($(this).find(&quot;ul#tzcontent&quot;).css(&quot;display&quot;) ==...

После обновления страницы на время съезжают картинки, после полной загрузки страницы все восстанавливается
Помогите разобраться.. не пойму, из-за чего съезжают картинки услуг в две колонки.. после полной загрузки, становится все на место... сайт...

7
 Аватар для Sn1p3rOk
288 / 175 / 86
Регистрация: 19.04.2014
Сообщений: 1,095
08.07.2015, 21:50
Неправильное добавление у вас.

JavaScript
1
$("<input type = 'submit' id = 'submit_code' value = 'Отправить' class = 'btn btn-success' />").appendTo('#dialogue');
0
1 / 1 / 0
Регистрация: 08.07.2015
Сообщений: 20
08.07.2015, 21:59  [ТС]
JavaScript
1
$('#dialogue').empty().append(' <input .....
Пробовал так, тоже не помогало
0
 Аватар для Sn1p3rOk
288 / 175 / 86
Регистрация: 19.04.2014
Сообщений: 1,095
08.07.2015, 22:49
Цитата Сообщение от ist70 Посмотреть сообщение
Пробовал так, тоже не помогало
Я не говорю, чтобы Вы попробовали... Я говорю, что у вас неправильное добавление.
Для того чтобы заработал клик для динамически добавленного элемента используйте метод on().
0
1 / 1 / 0
Регистрация: 08.07.2015
Сообщений: 20
09.07.2015, 00:02  [ТС]
Ну как можно это найти? Если везде про .on пишут по другому
НЕ РАБОТАЕТ - $(#submit_code).on('click', function (e) {

ВОТ ТАК РАБОТАЕТ - $(document).on('click','#submit_code', function (e) {

можно было подсказать и не ссылкой строки поиска для Гугля))))))

Добавлено через 40 секунд
Спасибо. Тема закрыта.
0
 Аватар для Sn1p3rOk
288 / 175 / 86
Регистрация: 19.04.2014
Сообщений: 1,095
09.07.2015, 01:44
Цитата Сообщение от ist70 Посмотреть сообщение
можно было подсказать и не ссылкой строки поиска для Гугля))))))
Приучайтесь к самостоятельности. Лучше самому разобраться и в дальнейшем не задаваться вопросом как это работает.
0
1 / 1 / 0
Регистрация: 08.07.2015
Сообщений: 20
09.07.2015, 07:38  [ТС]
Я 3 дня разбираюсь с такой мелкой проблемой)) Трудность в том, что в документации Jquery нет правильного ответа и примеров, только НЕ ПРАВИЛЬНЫЕ или как обычно что-то "недоговорили", "недописали". Они знают, а другие сами пусть ищут ответы. Это проблема с грамотной и полной документацией. Только на одном сайте нашёл человека, который написал как правильно использовать .ON
0
 Аватар для Sn1p3rOk
288 / 175 / 86
Регистрация: 19.04.2014
Сообщений: 1,095
09.07.2015, 13:58
Цитата Сообщение от ist70 Посмотреть сообщение
Это проблема с грамотной и полной документацией. Только на одном сайте нашёл человека, который написал как правильно использовать .ON
Ввел запрос в yandex "on jquery", в итого первый же результат вот эта ссылка http://jquery.page2page.ru/index.php5/On . Чем вам не полная документация обработчика on() ? По jQuery очень много материала и то, что документация является не полной - полная чушь.
Вот описание обработчика на офф. сайте http://api.jquery.com/on/ Более подробного руководства я нигде не встречал.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
09.07.2015, 13:58
Помогаю со студенческими работами здесь

Авто клик по кнопке после загрузки странице
мужики у меня вот такой вопрос.. Можно ли сделать авто клик при заходе на страницу но вот эту кнопку от одноклассники ( кнопка класс ) ? ...

Перезагрузка отдельной картинки страницы, после загрузки страницы
Возникла необходимость перезагрузки отдельной картинки страницы после вывода страницы браузером. Проблема в том, что картинка генится на...

Как обратиться к программно созданной кнопке, на программно созданной форме?
Ребят, я новичек в программировании, все время создавал кнопки вручную, но тут стало интересно научиться программно. Мне нужно чтобы по...

После загрузки страницы обрезаются все символы после точки
Доброго времени суток. У меня имеется следующая проблемка. Я имею стандартную картину, как MVC прогрузка данных на страницу. Но есть одно...

Плагин срабатывает только после обновления страницы
Добрый день! Помогите, пожалуйста, разобраться. Есть страница , захожу на нее, все баннеры растянуты по ширине блока, но стоит обновить...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
8
Ответ Создать тему
Новые блоги и статьи
PhpStorm 2025.3: WSL Terminal всегда стартует в ~
and_y87 14.12.2025
PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .
Access
VikBal 11.12.2025
Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук
volvo 07.12.2025
Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro
Музыка, написанная Искусственным Интеллектом
volvo 04.12.2025
Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .
От async/await к виртуальным потокам в Python
IndentationError 23.11.2025
Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов
Argus19 22.11.2025
Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .
Сколько Государство потратило денег на меня, обеспечивая инсулином.
Programma_Boinc 20.11.2025
Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .
Ломающие изменения в C#.NStar Alpha
Etyuhibosecyu 20.11.2025
Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .
Мысли в слух
kumehtar 18.11.2025
Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .
Создание Single Page Application на фреймах
krapotkin 16.11.2025
Статья исключительно для начинающих. Подходы оригинальностью не блещут. В век Веб все очень привыкли к дизайну Single-Page-Application . Быстренько разберем подход "на фреймах". Мы делаем одну. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2025, CyberForum.ru