Печатать входное значение для разных DIVS-jQuery

В настоящее время я работаю над небольшим проектом, поскольку я новичок в jQuery.Печатать входное значение для разных DIVS-jQuery

У меня есть 4 маленьких DIVS на моей странице с разными IDS из div1-div4. В верхней части страницы у меня есть INPUT, где пользователь сможет записать имя пользователя DIV, чтобы использовать разные функции. После первого ввода есть еще один вход, где пользователь сможет написать текст, который будет напечатан в DIV, который выбран на первом входе с помощью кнопки «Добавить текст».

После этого у меня есть 4 разных кнопки, которые выходят за пределы Fade Out, Fade In, Slide Up, Slide Down.

Эти функции будут работать только с идентификатором div, который пользователь написал в первом поле.

Вот пример JQuery одной из моих функций:

$("#fadeOutBtn").click(function(){ 

selectedDiv = $('#divChooseTxt').val(); 
$("#"+selectedDiv).fadeOut(1500, "swing", function(){ 

     }); 
    });

Что мне нужна помощь сейчас, чтобы понять, как получить текст от пользователя и печати, что выбранный DIV.

Вот в HTML для этой функции:

<label>Text: 
<input id="divTxt" type="text"> 
</label> 
<input id="addTextBtn" type="button" value="Add Text">

Можете ли вы мне помочь?

источник

2015-02-11 cssnewbie

http://fiddle.jshell.net/yc4ahsno/

Получить текст с Валу():

test = $('#divTxt').val();

Вставьте текст в DIV:

document.getElementById('thisdiv').innerHTML = test;

источник

2015-02-11 14:25:52 Sirence

http://fiddle.jshell.net/yc4ahsno/3/ document.getElementById (selectedDiv) .innerHTML = 'Вы выбрали этот div; – Sirence

Ваш пользователь вводит имя div и вы хотите выполнить изменения в этом div после нажатия кнопки отправки, правильно? Почему вы не сможете этого сделать с предоставленным кодом? Вы написали: «Теперь мне нужна помощь, чтобы понять, как получить текст от пользователя и распечатать его для выбранного DIV». С помощью этих функций вы можете получить текст и распечатать его. Попробуйте сначала обновить свой код и посмотреть, где у вас все еще есть проблемы. – Sirence

Ваша функция не будет работать, поскольку div, предоставленные вами в вашем html, имеют разные имена, поэтому я написал новую. Вы можете просто настроить свой код для достижения желаемого. – Sirence

Здесь вы идете. Следующим шагом будет использование функции внутри оператора switch.

JSFiddle

$('#submit').click(function() { 
    var name = $('#name').val(); 
    var content = $('#content').val(); 
    $('#results').html(name); 
    functions(name,content); 
}); 
function functions(name,content){ 
    switch(name){ 
     case 'a': 
      $('#div_one').css('background-color','red'); 
      $('#div_one').html(content); 
      break; 
      case 'b': 
      $('#div_two').css('background-color','red'); 
      $('#div_two').html(content); 
      break; 
      case 'c': 
      $('#div_three').css('background-color','red'); 
      $('#div_three').html(content); 
      break; 
      case 'd': 
      $('#div_four').css('background-color','red'); 
      $('#div_four').html(content); 
      break; 

    } 
}

Переключатель оператор принимает входные данные и соответствует корректной работы с ним.

источник

2015-02-11 14:39:06 Neoaptt

Печатать входное значение для разных DIVS-jQuery

ответ

Смежные вопросы