Poniższy kod działa dla pierwszego H3, ale także zmienia się drugi, więc skończyłem oba powiedzenie "Filtr kraju", potrzebuję pierwszego H3 do powiedzenia "Filtr kraju", a drugi do powiedzenia "Filtr stanu". Każda pomoc, bez zmiany HTML, byłaby doceniona. dzięki.

Oto HTML:

<h3>  
    <span class="label">Browse by</span> 
    <span class="location">Country</span> 
</h3>
<h3>  
    <span class="label">Browse by</span> 
    <span class="location">City</span> 
</h3>

Oto jQuery:

if ($(".location:contains('Country')")) {
    $(".label").text(function () {
        return $(this).text().replace("Browse by", "Country");
    });
    $(".location").text(function () {
        return $(this).text().replace("Country", "Filter");
    });
}

if ($(".location:contains('City')")) {
    $(".label").text(function () {
        return $(this).text().replace("Browse by", "State");
    });
    $(".location").text(function () {
        return $(this).text().replace("City", "Filter");
    });
}
0
user3169890 14 sierpień 2014, 22:20

3 odpowiedzi

Najlepsza odpowiedź

O wiele prostsze:

$(".location:contains('Country')").siblings().text("Country");
$(".location:contains('City')").siblings().text("State");
$(".location").text("Filter");

Dlaczego kierujesz się do rozpiętości przez tekst, który zawierają? Dlaczego kiedykolwiek będziesz musiał zmienić taką zawartość? Po prostu ciekawy.

0
Marcel 14 sierpień 2014, 18:34

Posługiwać się

//Find location that contains text
var countrylocation = $(".location:contains('Country')"); 
//As label is prev element, Here you can also use siblings
countrylocation.prev(".label").text(function () {
    return $(this).text().replace("Browse by", "Country");
});
countrylocation.text(function () {
    return $(this).text().replace("Country", "Filter");
});

var citylocation = $(".location:contains('City')");
citylocation.prev(".label").text(function () {
    return $(this).text().replace("Browse by", "State");
});
citylocation.text(function () {
    return $(this).text().replace("City", "Filter");
});

Bibliografia:

  1. .rodzeństwo()
  2. .prev ()
2
Satpal 14 sierpień 2014, 18:24

Zidentyfikuj znacznik zewnętrzny h3 za pomocą identyfikatora

<h3 id="country">
    <span class="label">Browse by</span> 
    <span class="location">Country</span> 
</h3>

Następnie odpowiednio zaktualizuj selektor:

$("#country .label").text(function () {
    return $(this).text().replace("Browse by", "Country");
});
0
cafonso 14 sierpień 2014, 18:26