Как найти, если div с определенным идентификатором существует в jQuery?

у меня есть функция, которая добавляет <div> к элементу по щелчку. Функция получает текст нажатого элемента и присваивает его переменной с именем name. Эта переменная затем используется как <div>id добавленного элемента.



мне нужно посмотреть, если a <div>id С name уже существует, прежде чем я добавлю элемент, но я не знаю, как это найти.



вот мой код:



$("li.friend").live('click', function() {

  name = $(this).text();



  // if-statement checking for existence of <div> should go here

  // If <div> does not exist, then append element

    $("div#chatbar").append("<div class='labels'><div id='" + name + "' style='display:none;'></div>" + name + "</div>");



  // Else

    alert('this record already exists');

});


это кажется довольно просто, но я получаю ошибку"неожиданный конец файла при поиске имени класса". Я понятия не имею, что это значит.



if (document.getElementById(name)) {

  $("div#" + name).css({bottom: '30px'});

} else {

  $("div#page-content div#chatbar").append("<div class='labels'>" + name + "</div><div id='" + name + "'></div>");

}


более того, я хочу иметь возможность удалить этот элемент, если я закрою его, который затем должен удалить div id [name] из документа, но .remove() не делай этого.



вот код:



$(".mini-close").live('click', function(){

  $(this).parent().remove();

});


добавил .mini-close к функции добавления в качестве дочернего элемента .labels так и было способ закрыть из прилагаемого <div> при необходимости. После нажатия кнопки .mini-close и пытается нажать на то же имя еще раз от li.friends он все еще находит div id [name] и возвращает первую часть моего if заявление.

553   10  

10 ответов:

можно использовать .length после селектора, чтобы увидеть, соответствует ли он каким-либо элементам, например:

if($("#" + name).length == 0) {
  //it doesn't exist
}

полная версия:

$("li.friend").live('click', function(){
  name = $(this).text();
  if($("#" + name).length == 0) {
    $("div#chatbar").append("<div class='labels'><div id='" + name + "' style='display:none;'></div>" + name + "</div>");
  } else {
    alert('this record already exists');
  }
});

или, не-jQuery версия для этой части (так как это идентификатор):

$("li.friend").live('click', function(){
  name = $(this).text();
  if(document.getElementById(name) == null) {
    $("div#chatbar").append("<div class='labels'><div id='" + name + "' style='display:none;'></div>" + name + "</div>");
  } else {
    alert('this record already exists');
  }
});
463  
2010-07-30 20:03:57

ответ Ника прибивает его. Вы также можете использовать возвращаемое значение getElementById непосредственно в качестве вашего условия, а не сравнивать его с null (в любом случае работает, но я лично считаю этот стиль немного более читаемым):

if (document.getElementById(name)) {
  alert('this record already exists');
} else {
  // do stuff
}
59  
2010-07-30 22:36:09

попробуйте проверить длину рычага, если он возвращает что-то, то элемент должен существовать еще нет.

if( $('#selector').length )         // use this if you are using id to check
{
     // it exists
}


if( $('.selector').length )         // use this if you are using class to check
{
     // it exists
}

используйте первое условие if для id и второе для класса.

23  
2013-10-08 16:46:00 
if($("#id").length) /*exists*/

if(!$("#id").length) /*doesn't exist*/
18  
2016-06-04 16:55:49 
if ( $( "#myDiv" ).length ) {
    //id id ( "#myDiv" ) is exist this will perform
    $( "#myDiv" ).show();

}

еще один быстрый способ:

    $( "#myDiv" ).length && $( "#myDiv" ).show();
7  
2017-09-18 10:17:35

вы можете проверить с помощью jquery просто так:

if($('#divId').length!==0){
      Your Code Here
}
5  
2013-11-04 06:43:30

самый простой способ..

if(window["myId"]){
    // ..
}

Это также часть спецификаций HTML5: https://www.w3.org/TR/html5/single-page.html#accessing-other-browsing-contexts#named-access-on-the-window-object

window[name]
    Returns the indicated element or collection of elements.
4  
2017-04-25 20:43:30

вы можете справиться с этим по-разному,

цель это проверить, существует ли div, а затем выполнить код. Простой.

состояние:

$('#myDiv').length

Примечание:

#myDiv -> < div id='myDiv' > <br>
.myDiv -> < div class='myDiv' >

Это будет возвращать число каждый раз, когда он выполняется, поэтому, если нет div, он даст ноль [0], и поскольку мы не можем представить 0 как false в двоичном формате, поэтому вы можете использовать его в операторе if. И вы можете использовать его в качестве сравнение с числом нет. в то время как любой есть три утверждения, приведенные ниже 

// Statement 0
// jQuery/Ajax has replace [ document.getElementById with $ sign ] and etc
// if you don't want to use jQuery/ajax 

   if (document.getElementById(name)) { 
      $("div#page-content div#chatbar").append("<div class='labels'>" + name + "</div><div id='" + name + "'></div>");
    }

// Statement 1
   if ($('#'+ name).length){ // if 0 then false ; if not 0 then true
       $("div#page-content div#chatbar").append("<div class='labels'>" + name + "</div><div id='" + name + "'></div>");
    }

// Statement 2
    if(!$('#'+ name).length){ // ! Means Not. So if it 0 not then [0 not is 1]
           $("div#page-content div#chatbar").append("<div class='labels'>" + name + "</div><div id='" + name + "'></div>"); 
    }
// Statement 3
    if ($('#'+ name).length > 0 ) {
      $("div#page-content div#chatbar").append("<div class='labels'>" + name + "</div><div id='" + name + "'></div>");
    }

// Statement 4
    if ($('#'+ name).length !== 0 ) { // length not equal to 0 which mean exist.
       $("div#page-content div#chatbar").append("<div class='labels'>" + name + "</div><div id='" + name + "'></div>");
    }
2  
2017-06-04 13:36:38

вот функция jQuery, которую я использую:

function isExists(var elemId){
    return jQuery('#'+elemId).length > 0;
}

это вернет логическое значение. Если элемент существует, он возвращает true. Если вы хотите выбрать элемент по имени класса, просто замените # С .

2  
2018-06-15 23:20:07

поместите идентификатор, который вы хотите проверить в методе jquery is.

var idcheck = $("selector").is("#id"); 

if(idcheck){ // if the selector contains particular id

// your code if particular Id is there

}
else{
// your code if particular Id is NOT there
}
1  
2014-04-28 10:30:06

Comments

    Ничего не найдено.
Click here to cancel reply.