Я не могу изменить значения в javascript динамически, после загрузки страницы PHP

0

В моем коде ниже я хочу изменить начальное значение с помощью ползунка. Ползунок работает и все, но он не меняет значения timeout, показанного под $('ul.<?php echo $this->session->userdata('username');?>').innerfade({ line.

Значение slider в строке $('#ex1').on('slide', function(slider) равно значению значения data-slider-value атрибута атрибута входной формы, которое равно 100.

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

Но проблема в том, что ползунок не изменит значения внутри кода jquery...


Поэтому, чтобы сделать это более понятным:

В коде JS переменная 'значение' объявляется, но еще не инициализируется значением.

Затем переменной 'value' присваивается значение 'slider.value'

И поэтому логический вывод состоит в том, что переменная "timeout" должна динамически меняться в соответствии со значениями, введенными слайдером.

<!-- Start slider -->
<p>
    <input id="ex1" data-slider-id='ex1Slider' type="text" data-slider-min="1" data-slider-max="1000" data-slider-step="1" data-slider-value="100"/>
</p>

<script type="text/javascript">
    $(document).ready(
    function(){
        var value;

        $('#ex1').slider();
        $('#ex1').on('slide', function(slider)
        {
            value = slider.value;
        });

        $('ul.<?php echo $this->session->userdata('username'); ?>').innerfade({
            speed: 0,
            timeout: value,
            type: 'sequence',
            containerheight: '480px'
        });
    });
</script>
  • 2
    Вы открыты для некоторых проблем с инъекцией с этим кодом. Никогда не вставляйте произвольные данные в контекст JavaScript, правильно их экранируя. Самый простой способ сделать это - использовать JSON-кодировку, поскольку она совместима с JavaScript. var username = <?php echo json_encode($this->session->userdata('username')); ?>;
  • 0
    Да, первый пользователь с '' в его имени будет тормозить этот код.
Показать ещё 1 комментарий

3 ответа

1
Лучший ответ

Это нормально, ваша анимация уже сделана. Вы должны изменить свою анимацию или лучше, измените ее.

редактировать:

Есть идея (не уверен, что это правильный синтаксис):

//make it
var usernameInnerFace = $('ul.<?php echo $this->session->userdata('username'); ?>').innerfade({
    speed: 0,
    timeout: value,
    type: 'sequence',
    containerheight: '480px'
});

//change it
usernameInnerFace.options['timeout'] = new_value;
  • 0
    О, так вы говорите, что я не могу изменить начальные значения, установленные внутри javascript, даже если эти значения установлены в переменные, которые установлены пользователем для ползунков?
  • 0
    Да, ваша анимация настроена на значение вашей переменной. Не ваша переменная. Чтобы быть точным, в javascript строка и скаляр задаются по значению (это копия значения), а объект по ссылке (есть только один объект, измените его, и он будет изменен в другой части кода).
Показать ещё 6 комментариев
1

Вы наклоняетесь, потому что функция innerfade работает до включения ("слайд"). При сдвиге вы должны вызвать функцию, которая устанавливает внутреннюю фрейм как это.

$(document).ready(
function(){

    $('#ex1').slider();
    $('#ex1').on('slide', function(slider)
    {
        setFade(slider.value);
    });


});

function setFade(value){
   $('ul.<?php echo $this->session->userdata('username'); ?>').innerfade({
        speed: 0,
        timeout: value,
        type: 'sequence',
        containerheight: '480px'
    });
}
  • 0
    С этим кодом, так как значение не инициализировано, функция innerFade прерывается, но когда я нажимаю на ползунок, он инициализирует значение для тайм-аута ... и когда я пытаюсь сдвинуть ползунок, чтобы изменить его значения, он не кажется? Хорошая идея вызывать функцию setFade, поскольку она работает
  • 0
    проверьте @grizznant комментарий ниже. Я никогда не использовал slide (), я просто указал правильный «порядок» действий. Я думаю, вы скоро найдете решение :)
Показать ещё 1 комментарий
0

Функция слайда получит 2 аргумента: событие и ui. Значение ползунка находится в объекте ui, поэтому я бы попытался:

$('#ex1').on('slide', function(event, ui) {
    value = ui.value;
});

как описано здесь:

http://api.jqueryui.com/slider/#event-slide

  • 0
    К сожалению, я забыл указать, какой слайдер я использую: eyecon.ro/bootstrap-slider

Ещё вопросы

Сообщество Overcoder
Наверх
Меню