Znajdowanie elementu za pomocą identyfikatora w odpowiedzi AJAX z jQuery

Muszę opublikować dane na stronie php, a następnie chciałbym uzyskać tekst pewnego elementu div, który jest w odpowiedzi, ale nie mogę ustawić wszystko poprawnie. Nie jestem zbyt dobra z jQuery, ale zazwyczaj mogę dość szybko zorientować się w problemach ... Byłem w tym przez chwilę i próbowałem wszystkiego, co znalazłem ... Myślę, że brakuje mi właściwej kombinacji rzeczy .Znajdowanie elementu za pomocą identyfikatora w odpowiedzi AJAX z jQuery

$.post("process.php", data , function (response) { 

     var w = window.open();  

     $(w.document.body).html(response); 

     console.log(typeof response); // yeilds string 
     //create jquery object from the response html 
     // var $data = $(response); // yeilds Uncaught Error: Syntax error, unrecognized expression: + whole html text 


     var success = $($.parseHTML(response)).find("#success"); 
     console.log('success'); 
     console.log(success);  // see screenshot 
     console.log(success.text()); // yields nothing 
     console.log(success.val()); // yields undefined 
     // if (window.focus) {w.focus()}; 

},'html');

to wyjście console.log(success); i czerwone pudełko jest to, co chcę z odpowiedzi ...

! [Ten obraz wydaje się naprawdę niewielka ... to nie było to, że kiedy zrobiłem mały to. Mam nadzieję, że nadal jest czytelny] [1]

i to robi, że:

var success = $(response).find("#success"); 
console.log('success'); 
console.log(success);  // yeilds Uncaught Error: Syntax error, unrecognized expression: + whole html text in red

Response jest ...

<html><head> 
    <style> 

     div.totals { 
      font-family:calibri; font-size:.9em; display:inline-block; 
      border-width: 2px; border-style: solid; border-color: #FFD324; 
      background-color: #FAF5D7; color: #514721; 
      width: 500px; 
      } 

     div.error_invalid { 
     font-family:calibri; font-size:.9em; display:inline-block; 
     border-width: 2px; border-style: solid; border-color: #9999CC; 
     background-color: #EEEEFF; color: #7979B8; 
    } 

    </style> 
    </head> 
    <body> 
    <div class="totals">Total new rows added: 0 out of 0<br/></div> 
    <br/><br/> 
    <div class="totals">Total updated rows: 0 out of 0 <br/></div> 

    <div id="success">true</div> 
    </body></html>

i próbowałem usuwając część stylu i dodałem w znaczniki html, head i body w nadziei, że to pomogłoby ... znaczenie, mam te same problemy, jeśli odpowiedź składa się tylko z trzech div.

Źródło

2013-04-26 gloomy.penguin

Może wyświetlać treść "respone" – pktangyue

tak. Nie byłem pewien, czy było to potrzebne, ponieważ to, co mi dało w zrzucie ekranu, wydawało się w tym momencie poprawnie interpretowane. –

Czy próbowałeś '$ (w.document.body) .find ('# success')'? – pktangyue

Zauważ, że wszystkie elementy są na tym samym poziomie? Musisz użyć .filter(), aby zawęzić bieżące zaznaczenie do pojedynczego elementu w tym wyborze, natomiast zamiast tego zobaczymy potomków obecnego zaznaczenia.

var success = $($.parseHTML(response)).filter("#success"); 
console.log(success); // div#success

Źródło

2013-04-26 15:58:48

dzięki. czy możesz mi powiedzieć, dlaczego ... czasami ... (kiedy szukałem w Google tego problemu) ... mówią, że robią '$ (odpowiedź)' i innym razem '$ ($ .parseHTML (odpowiedź))' –

$ .parseHTML to nowa metoda dodana w 1.8 tylko do parsowania html. Bezpieczniej jest używać $ .parseHTML, w niektórych przypadkach w IE10 rozwiązuje to problem z przeciekiem pamięci, nie jestem pewien, co jeszcze pomaga. –

jQuery 1.9 zmienił sposób obsługi HTML z ajax. Mianowicie prowadzące białe spacje są niedozwolone. Zobacz https://github.com/jquery/jquery-migrate/blob/master/warnings.md, aby uzyskać szczegółowe informacje. –

mam pełną „html” strony zwrócony przez AJAX, ale wystarczy częściowe jego zawartości, która owinięta przez div, a także muszę wykonać skrypt wewnątrz stronie „html”.

$.ajax ({ 
    type: "POST", 
    url : "contact.php", 
    data: $("#formContactUs").serialize(), 
    success: function(msg){ 
    console.log($(msg)); // this would returned as an array 
    console.log(msg); // return whole html page as string '<html><body>...</body></html>' 
    $('#id').html($(content).closest('.target-class')); 
    $('#id').append($(content).closest('script')[0]); // append and execute first script found, when there is more than one script. 
    } 
});

@kevin odpowiedź dał wskazówek, dlaczego znaleźliśmy() nie działa zgodnie z oczekiwaniami, gdyż tylko wybrać jego potomka, ale nie pierwszy element pod uwagę. Oprócz użycia filtru funkcja $ .closest() działa również, jeśli bieżący element jest tym, czego szukasz. No cóż, prawdopodobnie ten post bardzo podobny do odpowiedzi @ Kevina, to po prostu zasugerować inną alternatywną odpowiedź i podać więcej szczegółów, które, miejmy nadzieję, sprawią, że rzecz będzie wyraźniejsza.

Źródło

2014-11-14 16:33:35 ken

Znajdowanie elementu za pomocą identyfikatora w odpowiedzi AJAX z jQuery

Odpowiedz

Powiązane problemy