Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

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

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

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 03.08.2017, 12:23   #1
Bagaganak
Пользователь
 
Регистрация: 28.07.2017
Сообщений: 15
По умолчанию 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 в 13:02.
Bagaganak вне форума Ответить с цитированием
Старый 03.08.2017, 12:29   #2
Alex11223
Старожил
 
Аватар для Alex11223
 
Регистрация: 12.01.2011
Сообщений: 19,500
По умолчанию

обновление откуда?
Ушел с форума, https://www.programmersforum.rocks, alex.pantec@gmail.com, https://github.com/AlexP11223
ЛС отключены Аларом.
Alex11223 вне форума Ответить с цитированием
Старый 03.08.2017, 12:45   #3
Bagaganak
Пользователь
 
Регистрация: 28.07.2017
Сообщений: 15
По умолчанию

Ну скрипт сработал, вывел число, нужно с помощью кнопки перезапустить скрипт что бы он вывел другое число, не перезагружая страницу
Bagaganak вне форума Ответить с цитированием
Старый 03.08.2017, 13:04   #4
Alex11223
Старожил
 
Аватар для Alex11223
 
Регистрация: 12.01.2011
Сообщений: 19,500
По умолчанию

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

и document.write тут всю страницу перезапишет, говорили ж уже.
Ушел с форума, https://www.programmersforum.rocks, alex.pantec@gmail.com, https://github.com/AlexP11223
ЛС отключены Аларом.

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

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

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

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

Код:
var element = getElementByID('my-elem');

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

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

// Добавить содержимое к элементу
element.innertHTML += '<button></button>';
<Дзен - Вся вселенная в тебе > | Резюме: https://ch3ll0v3k.github.io/CV/
pompiduskus вне форума Ответить с цитированием
Старый 03.08.2017, 14:53   #7
Bagaganak
Пользователь
 
Регистрация: 28.07.2017
Сообщений: 15
По умолчанию

Нужно что бы код по кнопке перезапускал этот код так,что бы менялся текст и картинка, но страница не должна перезагружаться
Код 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, 15:44   #8
pompiduskus
юзер как все
Участник клуба
 
Аватар для pompiduskus
 
Регистрация: 10.01.2012
Сообщений: 1,586
По умолчанию

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

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

Код:
<!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>
<Дзен - Вся вселенная в тебе > | Резюме: https://ch3ll0v3k.github.io/CV/
pompiduskus вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


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