2011-10-31 7 views
7

zrobiłem bardzo prosty przycisk obsługi zdarzenia kliknięcia, chciałbym mieć <p> elementem być dołączane po naciśnięciu kliknięciu można sprawdzić my code here:O jQuery append() i jak sprawdzić, czy element został dołączony

<div id="wrapper"> 
    <input id="search_btn" value="Search" type="button"> 
</div> 
$("#search_btn").click(function(){ 
    $("#wrapper").append("<p id='other'>I am here</p>"); 
}); 

mam dwa pytaniaaby zapytać:

1, dlaczego mój .append() nie działa zgodnie z oczekiwaniami (to dołączenie elementu <p>)

2. w jQuery, jak sprawdzić, czy jakiś element jest już dołączany? Na przykład, jak sprawdzić, czy <p id="other"> jest już dołączony w moim przypadku?

-------------------- aktualizacja ------------------------ -------------------

Proszę sprawdzić my updated code here.

Tak, tylko pozostaje pytanie 2nd ...

+2

jsfiddle domyślnie ładuje MooTools. Często też zapominam o zmianie. –

+0

Znaczniki samozakleszczące nie obsługują funkcji dopisywania. Chociaż można to zrobić za pomocą .next() –

Odpowiedz

22
  1. Używasz mootools, a nie jQuery.

  2. Aby sprawdzić, czy istnieje element

if($('#other').length > 0)

więc jeśli nie chcesz dołączyć element dwukrotnie:

$("#search_btn").click(function() { 
    if($('#other').length == 0) { 
     $("#wrapper").append("<p id='other'>I am here</p>"); 
    } 
}); 

Lub można użyć .one(function) [ doc]:

$("#search_btn").one('click', function() { 
    $("#wrapper").append("<p id='other'>I am here</p>"); 
}); 
4

1) jsFiddle ładunki w MooTools domyślnie trzeba podać jQuery to zadziałało. Na świecie nie ma powodu, by ten przykład nie działał. (Zakładając, że $ faktycznie mapowane do obiektu jQuery, że jest.)

2) Można sprawdzić nextSibling o DOMElement lub użyć metody next() jQuery, tak:

if(!$('#something').next().length) { 
    //no next sibling. 
} 
+0

Wyjaśnienie na 1: skrzypce nie ładuje biblioteki jQuery, ale narzędzie mootools. Ta działa: http://jsfiddle.net/j36ye/16/ – Lekensteyn

1

Twoje skrzypce używają struktury narzędzi Moo. Zmień go, aby korzystać z frameworku jquery po lewej stronie i działa.Zobacz http://jsfiddle.net/KxGsj/

2

http://jsfiddle.net/j36ye/17/

$("#search_btn").click(function(){ 
    if(($('#other').length) == 0) { 
     $("#wrapper").append("<p id='other'>I am here</p>"); 
    } 
    return false 
}); 

Albo

var other_appended = false; 

$("#search_btn").click(function(){ 
    if(other_appended == false) { 
     $("#wrapper").append("<p id='other'>I am here</p>"); 
      other_appended = true; 
    } 
    return false; 
}); 
2

Jak sprawdzić czy element istnieje:

if($("p#other").length > 0) { 
    // a p element with id "other" exists 
} 
else { 
    // a p element with id "other" does not exist 
} 
1

sprawdzić, czy element jest już dołączany:

alert($(this).parent().length?'appended':'not appended'); 
Powiązane problemy