#javascript #html #jquery
#язык JavaScript #HTML #jquery
Вопрос:
Как я могу заменить значение входного тега на тег p.para? Пожалуйста, найдите код, который я использовал…
Html-разметка :
lt;h2gt;jQuery Misclt;/h2gt; lt;div class="content"gt; lt;pgt; lt;a href="#"gt;My linklt;/agt; lt;/pgt; lt;p class="para"gt;This is para no #1lt;/pgt; lt;pgt; lt;stronggt;Hello world!lt;/stronggt; lt;/pgt; lt;buttongt;Actionlt;/buttongt; lt;/divgt;
Jquery :
lt;script type="text/javascript"gt; jQuery(function($) { const $p = $('lt;pgt;This is a new para!lt;/pgt;'); const $contentDiv = $('.content'); $('button').on('click', function() { const $userName = $('lt;h3gt;lt;input type="text" id="input" placeholder="Enter your name"gt;lt;/h3gt;') const $okay = $('lt;button class="bttn"gt;Okaylt;/buttongt;') const $cancel = $('lt;button class="bttn_2"gt;Cancellt;/buttongt;') // $('.para').remove(); // $contentDiv.append($userName); $userName.appendTo($contentDiv); $okay.appendTo($contentDiv); $cancel.appendTo($contentDiv); $('.bttn_2').on('click', function() { $userName.remove(); $okay.remove(); $cancel.remove(); }); $('.bttn').on('click', function() { $okay.remove(); $cancel.remove(); $userName.appendTo($contentDiv); $('div.content div.para').text(function() { return $('input',this).val(); }); }); }); }); lt;/scriptgt;
Здесь я хочу изменить значение входного тега на элемент p.para. После имени пользователя const $для замены элемента класса p.para при отправке входного значения. Каждый раз, когда я отправляю входное значение, оно должно заменяться предыдущим входным значением, которое я отправил. Как я могу это сделать?? пожалуйста, помогите.
Пожалуйста, помогите..заранее спасибо!!
Ответ №1:
Вы можете опробовать этот код :
lt;!DOCTYPE htmlgt; lt;htmlgt; lt;headgt; lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"gt;lt;/scriptgt; lt;script type="text/javascript"gt; jQuery(function($) { const $p = $('lt;pgt;This is a new para!lt;/pgt;'); const $contentDiv = $('.content'); $('button').on('click', function() { const $userName = $('lt;h3gt;lt;input type="text" id="input" placeholder="Enter your name"gt;lt;/h3gt;') const $okay = $('lt;button class="bttn"gt;Okaylt;/buttongt;') const $cancel = $('lt;button class="bttn_2"gt;Cancellt;/buttongt;') // $('.para').remove(); // $contentDiv.append($userName); $userName.appendTo($contentDiv); $okay.appendTo($contentDiv); $cancel.appendTo($contentDiv); $('.bttn_2').on('click', function() { $userName.remove(); $okay.remove(); $cancel.remove(); }); $('.bttn').on('click', function() { $okay.remove(); $cancel.remove(); $userName.appendTo($contentDiv); var input_val = $('#input').val(); $('.para').text(input_val); }); }); }); lt;/scriptgt; lt;/headgt; lt;bodygt; lt;h2gt;jQuery Misclt;/h2gt; lt;div class="content"gt; lt;pgt; lt;a href="#"gt;My linklt;/agt; lt;/pgt; lt;p class="para"gt;This is para no #1lt;/pgt; lt;pgt; lt;stronggt;Hello world!lt;/stronggt; lt;/pgt; lt;buttongt;Actionlt;/buttongt; lt;/divgt; lt;/bodygt; lt;/htmlgt;