Форум программистов
 
Расширенный поиск
Контакты: о проблемах с регистрацией, почтой и по другим вопросам пишите сюда - alarforum@yandex.ru, проверяйте папку спам! Обязательно пройдите активизацию e-mail.

Вернуться   Форум программистов > Web > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail

Ответ
 
Опции темы
Старый 03.08.2017, 13:23   #1
Bagaganak
Пользователь
 
Регистрация: 28.07.2017
Сообщений: 15
Репутация: 10
По умолчанию JavaScript(обновление скрипта без перезагрузки страницы)

Есть код:
Код HTML:
<script>
var cont=["1","2","3"]
var rand=Math.floor(Math.random()* cont.length);
document.write(var[rand]);
<script>

Подскажите как можно сделать обновление такого скрипта по кнопке без перезагрузки страницы?


Пробовал :
Код HTML:
<input id="elem" value="Нажми меня" type="button">
<script>
elem.onclick = function() {
var cont=["1","2","3"]
var rand=Math.floor(Math.random()* cont.length);
document.write(var[rand]);
};
<script>
Но почему-то при нажатии отправляет на другую страницу с выведенным текстом.

Последний раз редактировалось Bagaganak; 03.08.2017 в 14:02.
Bagaganak вне форума   Ответить с цитированием
Старый 03.08.2017, 13:29   #2
Alex11223
Модератор
Заслуженный модератор
 
Регистрация: 12.01.2011
Сообщений: 15,309
Репутация: 3001

icq: 512-7шесть5
skype: alexp.frl
По умолчанию

обновление откуда?
Alex11223 вне форума   Ответить с цитированием
Старый 03.08.2017, 13:45   #3
Bagaganak
Пользователь
 
Регистрация: 28.07.2017
Сообщений: 15
Репутация: 10
По умолчанию

Ну скрипт сработал, вывел число, нужно с помощью кнопки перезапустить скрипт что бы он вывел другое число, не перезагружая страницу
Bagaganak вне форума   Ответить с цитированием
Старый 03.08.2017, 14:04   #4
Alex11223
Модератор
Заслуженный модератор
 
Регистрация: 12.01.2011
Сообщений: 15,309
Репутация: 3001

icq: 512-7шесть5
skype: alexp.frl
По умолчанию

Цитата:
Сообщение от Bagaganak Посмотреть сообщение
почему-то
https://learn.javascript.ru/devtools
https://learn.javascript.ru/debugging-chrome

и document.write тут всю страницу перезапишет, говорили ж уже.

Последний раз редактировалось Alex11223; 03.08.2017 в 14:06.
Alex11223 вне форума   Ответить с цитированием
Старый 03.08.2017, 14:30   #5
Bagaganak
Пользователь
 
Регистрация: 28.07.2017
Сообщений: 15
Репутация: 10
По умолчанию

Цитата:
Сообщение от Alex11223 Посмотреть сообщение

и document.write тут всю страницу перезапишет, говорили ж уже.
С document.append() все то же самое
Bagaganak вне форума   Ответить с цитированием
Старый 03.08.2017, 15:11   #6
pompiduskus
юзер как все
Профессионал
 
Аватар для pompiduskus
 
Регистрация: 10.01.2012
Адрес: земля
Сообщений: 1,564
Репутация: 629

icq: 446.452.423
По умолчанию

Много разных вариатов, смотря что нужно

Код:

var element = getElementByID('my-elem');

// Добавить содержимое к элементу не нарушая все события и все важно и настроено
element.insertAdjacentHTML( "beforeend", '<button></button>' );

// Перезаписать содержимое элемениа
element.innertHTML = '<button></button>';

// Добавить содержимое к элементу
element.innertHTML += '<button></button>';

__________________
<Дзен - Вся вселенная в тебе > | <Рай - это всего лишь мечта терпящего страдания ада> | github.com/ch3ll0v3k
pompiduskus вне форума   Ответить с цитированием
Старый 03.08.2017, 15:53   #7
Bagaganak
Пользователь
 
Регистрация: 28.07.2017
Сообщений: 15
Репутация: 10
По умолчанию

Нужно что бы код по кнопке перезапускал этот код так,что бы менялся текст и картинка, но страница не должна перезагружаться
Код HTML:
<script>
var cont = ['<p class="text">  text 1</p>  <img src="1.jpg">','<p class="text">  text2.</p>  <img src="2.jpg">','<p class="text">  text 3  </p>  <img src="3.jpg" >'];
var r = Math.floor(Math.random()* cont.length);
document.write(cont[r]);
</script>
Bagaganak вне форума   Ответить с цитированием
Старый 03.08.2017, 16:44   #8
pompiduskus
юзер как все
Профессионал
 
Аватар для pompiduskus
 
Регистрация: 10.01.2012
Адрес: земля
Сообщений: 1,564
Репутация: 629

icq: 446.452.423
По умолчанию

А выше что написано, религия не позволяет прочитать ?
Изображения
Тип файла: jpg ruka_lico.jpg (12.1 Кб, 1 просмотров)
__________________
<Дзен - Вся вселенная в тебе > | <Рай - это всего лишь мечта терпящего страдания ада> | github.com/ch3ll0v3k
pompiduskus вне форума   Ответить с цитированием
Старый 03.08.2017, 17:04   #9
Bagaganak
Пользователь
 
Регистрация: 28.07.2017
Сообщений: 15
Репутация: 10
По умолчанию

Можете подсказать как это использовать в моем случае?
Bagaganak вне форума   Ответить с цитированием
Старый 04.08.2017, 02:17   #10
pompiduskus
юзер как все
Профессионал
 
Аватар для pompiduskus
 
Регистрация: 10.01.2012
Адрес: земля
Сообщений: 1,564
Репутация: 629

icq: 446.452.423
По умолчанию

Код:

<!DOCTYPE html>
<html lang="en-US">
<head>

    <title>Page-Title</title>
    <meta charset="utf-8"/>
    <link rel="stylesheet" type="text/css" href="css/main.css">
    <style type="text/css">

    #wrapper{ 
        width: 400px; height: 400px; margin: 25px auto; border: solid 1px #000;
        text-align: center; padding-top: 10px; font-size: 20px;
    }

    button{ width: 300px; margin: 20px auto; padding: 10px; font-size: 14px; }

    </style>

    <script type="text/javascript">

    function main_func(name){
        document.getElementById('main').innerHTML = 'button: [<b>'+name+'</b>] OK'

    }


    function A(){
        main_func('A');
        document.getElementById('wrapper').style.background = '#fff';
    }

    function B(){
        main_func('B');
        document.getElementById('wrapper').style.background = '#F00';
    }

    function C(){
        main_func('C');
        document.getElementById('wrapper').style.background = '#0F0';
    }

    function D(){
        main_func('D');
        document.getElementById('wrapper').style.background = '#00F';
    }


    </script>

</head>
<body>
<!-- ========================================================== -->
<div id="wrapper">
    
    <div id="main">
        test
    </div>
    
    <button onclick="A()">function A</button>
    <button onclick="B()">function B</button>        
    <button onclick="C()">function C</button>
    <button onclick="D()">function D</button>

</div>

<!-- ========================================================== -->
</body>
</html>

__________________
<Дзен - Вся вселенная в тебе > | <Рай - это всего лишь мечта терпящего страдания ада> | github.com/ch3ll0v3k
pompiduskus вне форума   Ответить с цитированием
Ответ



Опции темы

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.

Быстрый переход

Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Загрузка разных кусков php скрипта без перезагрузки страницы SergeyZhuk PHP 7 26.07.2017 19:11
Голосование Без Перезагрузки Страницы Nick888 HTML и CSS 1 11.01.2015 02:44
Голосование без перезагрузки страницы Nick888 PHP 2 26.12.2014 10:21
Голосование Без Перезагрузки Страницы Nick888 WordPress и другие CMS 0 23.12.2014 22:56
Динамическое изменение URL страницы в JavaScript без перезагрузки страницы ilusha JavaScript, Ajax 7 25.02.2009 10:59




06:46.


Powered by vBulletin® Version 3.8.8 Beta 2
Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.

купить трафик


как улучшить посещаемость, а также решения по монетизации сайтов, видео и приложений

RusProfile.ru


Справочник российских юридических лиц и организаций.
лучший хостинг
Выбираем лучший хостинг: рейтинг ТОП 10
Проекты отопления, пеллетные котлы, бойлеры, радиаторы
интернет магазин respective.ru