Upewnij się, że ciąg jest poprawną nazwą CSS o nazwie

Mam kilka rekordów bazy danych (bez identyfikatorów auto_increment lub cokolwiek innego w tym stylu) renderowanych jako lista, i doszło do tego, że muszę rozróżnić każdą z nich za pomocą unikalnego id.Upewnij się, że ciąg jest poprawną nazwą CSS o nazwie

Mogę po prostu dodać licznik bieżący do pętli i zrobić to, ale niestety ten identyfikator musi być powiązany w całej witrynie, jednak lista jest sortowana lub filtrowana.

W związku z tym wpadłem na pomysł, aby tytuł rekordu dołączyć do części id (z prefiksem, aby nie kolidował z elementami układu).

Jak mogę przekształcić ciąg znaków w nazwę id w niezawodny sposób, tak aby nigdy nie zawierał znaków, które złamałyby kod HTML lub nie działałyby jako prawidłowe selektory CSS?

Na przykład;

Title ==> prefix_title 
TPS Report 2010 ==> prefix_tps_report_2010 
Mike's "Proposal" ==> prefix_mikes_proposal 
#53: Míguèl ==> prefix_53_miguel

Tytuły są zawsze wystarczająco różnorodne, aby uniknąć konfliktów i nigdy nie będą zawierały żadnych nie-zachodnich postaci.

Dzięki!

Źródło

2012-05-16 Emphram Stavanger

Jeśli dostanę swój punkt: masz jakiś wiersz w tabeli , dla każdego wiersza, który chcesz wygenerować element listy HTML, a każdy element powinien mieć unikalny identyfikator (atrybut HTML "id"?), ten identyfikator nie powinien łamać HTML i być prawidłowym selektorem CSS. Dlaczego potrzebujesz czegoś takiego i dlaczego mówisz o poprawnym selektorze CSS? Nie można pisać * statycznego * selektora CSS na podstawie * dynamicznych * identyfikatorów. – pomeh

Dlaczego nie używać MD5? –

pomeh: Muszę odwoływać się do poszczególnych elementów listy za pomocą jQuery, a to o wiele łatwiej, jeśli podczas drukowania listy mam zestaw id dla każdego elementu. || Rick: To ... zawstydzająco proste, ale niesamowite rozwiązanie. –

Nie trzeba w ogóle używać atrybutu HTML id. Możesz użyć HTML5 data-* attribute do przechowywania wartości zdefiniowanych przez użytkownika. Oto przykład:

<ul class="my-awesome-list"> 
    <!-- PHP code, begin a for/while loop on rows --> 
    <li data-rowtitle="<?php echo json_encode($row["title"]); ?>"> 
     <?php echo $row["title"]; ?> 
    </li> 
    <!-- PHP loop end --> 
</ul>

Następnie w ciebie kodu jQuery, można uzyskać dostęp do DATA- * Wartości metodą $.fn.data

$(".my-awesome-list li").each(function(){ 
    var realTitle = $(this).data('rowtitle'); 
});

Źródło

2012-05-16 13:33:10 pomeh

jest to' data-xxxx' i $ (y) .data (xxxx) jest wbudowaną funkcjonalnością jQuery? A jak to jest w przypadku przeglądarki krzyżowej? –

Atrybuty 'data- *' zdefiniowane są w specyfikacji HTML5. Możesz jednak z nich korzystać, nawet jeśli Twoja strona nie korzysta z HTML5, są one rozpoznawane przez wszystkie przeglądarki. – pomeh

Ale co jeśli chciałbym wybrać konkretny 'li'? Czy nie wymagałoby to zapętlenia listy sprawdzającej każdy element pod kątem konkretnego atrybutu 'data- *', co oznacza, że równie dobrze mogę po prostu zapomnieć o atrybucie i sprawdzić bezpośrednio zawartość listy? –

Potrzebowałem podobnego rozwiązania dla Deeplink kotwic.

Znaleziony to przydatne:

function seoUrl($string) { 
    //Lower case everything 
    $string = strtolower($string); 
    //Make alphanumeric (removes all other characters) 
    $string = preg_replace("/[^a-z0-9_\s-]/", "", $string); 
    //Clean up multiple dashes or whitespaces 
    $string = preg_replace("/[\s-]+/", " ", $string); 
    //Convert whitespaces and underscore to dash 
    $string = preg_replace("/[\s_]/", "-", $string); 
    return $string; 
}

kredytowe: https://stackoverflow.com/a/11330527/3010027

PS: Wordpress Użytkownicy mają wyglądać tutaj: https://codex.wordpress.org/Function_Reference/sanitize_title

Źródło

2014-05-07 12:14:58 optimiertes

Upewnij się, że ciąg jest poprawną nazwą CSS o nazwie

Odpowiedz

Powiązane problemy