Как вставить элемент с помощью jQuery?

Мне нужно вставить всплывающую подсказку после элемента ниже, пожалуйста, дайте мне знать, как мне это сделать. Я хочу добавить сообщение «Пожалуйста, введите значение» с помощью Jquery.

в моем элементе DOM я получаю только это: -

<div class = "k-widget k-tooltip k-tooltip-validation k-invalid-msg" role = "alert" style = "margin: 0.5em; display: block;" data-for = "ContactPhoneCountryCode">
  <span class = "k-icon k-i-warning"> </span> 
  <div class = "k-callout k-callout-n"></div>
</div>

Но я хочу так: -

<div class = "k-widget k-tooltip k-tooltip-validation k-invalid-msg" role = "alert" style = "margin: 0.5em; display: block;" data-for = "ContactPhoneCountryCode">
  <span class = "k-icon k-i-warning"> </span> Please enter value
  <div class = "k-callout k-callout-n"></div>
</div>

Пожалуйста помогите

Что вы сделали, чтобы получить текущий результат?

josephting 06.03.2019 05:58

Вы имеете в виду, что хотите добавить текст внутри тега span '.k-i-warning'?

Jigar 06.03.2019 05:59

с помощью обертывания

Krishna Jonnalagadda 06.03.2019 06:05

В настоящее время мой дом отображается следующим образом: <div class = "k-widget k-tooltip k-tooltip-validation k-invalid-msg" role = "alert" style = "margin: 0.5em; display: block;" data-for = "ContactPhoneCountryCode"> <span class = "k-icon k-i-warning"> </span> <div class = "k-callout k-callout-n"></div> </div>

Kumas 06.03.2019 16:00

Но мне нужно добавить один текст с помощью Jquery - <div class = "k-widget k-tooltip k-tooltip-validation k-invalid-msg" role = "alert" style = "margin: 0.5em; display: block;" data-for = "ContactPhoneCountryCode"><span class = "k-icon ki-warning"> </span>Введите значение<div class = "k-callout k-callout-n"></div></div >

Kumas 06.03.2019 16:00
Как конвертировать HTML в PDF с помощью jsPDF
Как конвертировать HTML в PDF с помощью jsPDF
В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.
1
5
53
3
Перейти к ответу Данный вопрос помечен как решенный

Ответы 3

Привет, вы можете использовать метод after для вставки текста после определенного тега в jquery.

$(".k-i-warning").after('Please enter value');

Спасибо за ответ, все еще я получаю тот же ответ. <div class = "k-widget k-tooltip k-tooltip-validation k-invalid-msg" role = "alert" style = "margin: 0.5em; display: block;" data-for = "ContactPhoneCountryCode"><span class = "k-icon k-i-warning"> </span><div class = "k-callout k-callout-n"></div></div>

Kumas 06.03.2019 15:58

Можете ли вы написать этот код js внутри после метода загрузки документа $(document).load(function(){});

Jigar 06.03.2019 16:02
Ответ принят как подходящий

Попробуйте это, я проверил это в своем локальном файле, и он работает в соответствии с вашими потребностями.

<!DOCTYPE html>
<html>
    <head>
        <script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    </head>
    <body>

        <div class = "k-widget k-tooltip k-tooltip-validation k-invalid-msg" role = "alert" style = "margin: 0.5em; display: block;" data-for = "ContactPhoneCountryCode">
            <span class = "k-icon k-i-warning"> </span> 
            <div class = "k-callout k-callout-n"></div>
        </div>

        <script>
            $(".k-icon").after("Please enter value.");
        </script>
    </body>
</html>

Это даст вам вывод, например, <div class = "k-widget k-tooltip k-tooltip-validation k-invalid-msg" role = "alert" style = "margin: 0.5em; display: block;" data-for = "ContactPhoneCountryCode"> <span class = "k-icon ki-warning"> </span> Пожалуйста, введите значение <div class = "k-callout k-callout-n"></div> </div >

Abdulrehman Sheikh 06.03.2019 06:44

Большое спасибо за ваш ответ, я попробовал ваше решение, оно не сработало для меня, я все еще получаю этот вывод: роль <div class = "k-widget k-tooltip k-tooltip-validation k-invalid-msg" = "alert" style = "margin: 0.5em; display: block;" data-for = "ContactPhoneCountryCode"><span class = "k-icon k-i-warning"> </span><div class = "k-callout k-callout-n"></div></div>

Kumas 06.03.2019 15:55

Вместо этого мне нужно: <div class = "k-widget k-tooltip k-tooltip-validation k-invalid-msg" role = "alert" style = "margin: 0.5em; display: block;" data-for = "ContactPhoneCountryCode"><span class = "k-icon ki-warning"> </span>Введите значение<div class = "k-callout k-callout-n"></div></div >

Kumas 06.03.2019 15:55

@Kumas Это должно работать. Покажите мне свой вывод, потому что я протестировал его, и он отлично работает с моими файлами.

Abdulrehman Sheikh 06.03.2019 16:50

@Kumas попробуйте это setTimeout(function(){ $(".k-icon").after("Пожалуйста, введите значение.");}, 3000); replace $(".k-icon").after("Введите значение."); с данным кодом.

Abdulrehman Sheikh 06.03.2019 16:51

<script> setTimeout(function(){ $(".k-icon").after("Пожалуйста, введите значение.");}, 3000); </скрипт>

Abdulrehman Sheikh 06.03.2019 16:51

Замените мой тег <script> данным тегом и сообщите мне, работает ли он или нет

Abdulrehman Sheikh 06.03.2019 16:52

Привет, еще раз спасибо за ваш ответ, да, наконец, он работает нормально

Kumas 06.03.2019 17:36

Мой брат удовольствия!

Abdulrehman Sheikh 06.03.2019 18:38

Привет after метод работает, попробуйте и этот insertAfter метод

$( "<span>Please enter value</span>" ).insertAfter( ".k-i-warning" );

Спасибо, Сэм, за ваш ответ, но все равно это не сработало, я получаю сообщение об отсутствии обновления, вот результат: <div class = "k-widget k-tooltip k-tooltip-validation k-invalid-msg" role = "alert" style = "margin: 0.5em; display: block;" data-for = "ContactPhoneCountryCode"><span class = "k-icon k-i-warning"> </span><div class = "k-callout k-callout-n"></div></div>

Kumas 06.03.2019 15:52

Вместо этого мне нужно: <div class = "k-widget k-tooltip k-tooltip-validation k-invalid-msg" role = "alert" style = "margin: 0.5em; display: block;" data-for = "ContactPhoneCountryCode"><span class = "k-icon ki-warning"> </span>Введите значение<div class = "k-callout k-callout-n"></div></div >

Kumas 06.03.2019 15:53

Другие вопросы по теме