0

私はWordpressでウェブサイトを持っています。子ページにメニューを表示しています。すべてが完璧に機能します。インデックス A、B、C などの形式もあります。私のcssでは、すべてが大文字です。Chrome、Firefoxでは機能しますが、Safariでは機能しません。たとえば、メニューのオプションは小文字です。したがって、ページタイトルを大文字で入力する必要があります...これは私が推測する最善の解決策ではありません....CSSを使用する代わりに、post_titleを大文字にするphp関数を追加したいと思います。「strtoupper」関数を使用できることはわかっていますが、この場合、誰が使用するかわかりません。

echo '<select name="" onchange="location = this.options[this.selectedIndex].value;">';

メニューを構築する完全なphpコードは次のとおりです。

<div class="styled-select">
<?php

if(!$post->post_parent){

    $children = get_pages(array(
        'child_of' => $post->ID,
        'post_type' => 'page',
        'post_status' => 'publish',
        'sort_order' => 'ASC',
        'sort_column' => 'post_title',
    ));

}else{

    $children = get_pages(array(
        'child_of' => $post->post_parent,
        'post_type' => 'page',
        'post_status' => 'publish',
        'sort_order' => 'ASC',
        'sort_column' => 'post_title',
    ));
}

if ($children) {
    echo '<select name="" onchange="location = this.options[this.selectedIndex].value;">';
    echo '<option>'. 'A - Z' .'</option>';

    function getInitials($name){
    //split name using spaces
    $words=explode(" ",$name);
    $inits='';
    //loop through array extracting initial letters
    foreach($words as $word){
        $inits = strtoupper(substr($word,0,1));
        break;
    }
    return $inits; 
}
$currval = "";

    foreach($children as $child){
        //print_r($child);
        $permalink = get_permalink($child->ID);
        $initial = getInitials($child->post_title);
        if($initial!='' && $currval != $initial ) {
            $currval = $initial;
            echo '<optgroup label="'.$initial.'""></optgroup>';
        }
        echo '<option value="'.$permalink.'">'.$child->post_title.'</option>';
    }
    echo '</select>';


} ?>


<!-- FIN MENU DEROULANT A-Z -->


</div>

ここにjsfiddleがあります:http://jsfiddle.net/3LZEt/

誰かが私を助けることができれば! どうもありがとう。

4

1 に答える 1

0

表示されるオプション テキストは、リダイレクトが発生しないこととは関係ありません。

リダイレクトが実際にあなたを悩ませているものであることを正しく理解しましたか? そして、あなたはサファリモバイルを試しましたか?もしそうなら、それはonchangeをサポートしていませんが、onblurをサポートしています

echo '<select name="" onblur="location = this.options[this.selectedIndex].value;">';

しかし、これは私が思うに他のブラウザを壊します。そのため、動作中のブラウザと動作していないブラウザの切り替えは、一方を onchange にし、もう一方を onblur にする必要があります。

編集 この部分をご覧ください。投稿のタイトルがあります

foreach($children as $child){
    //print_r($child);
    $permalink = get_permalink($child->ID);
    $initial = getInitials($child->post_title);
    if($initial!='' && $currval != $initial ) {
        $currval = $initial;
        echo '<optgroup label="'.$initial.'""></optgroup>';
    }
    echo '<option value="'.$permalink.'">'.$child->post_title.'</option>';
}

したがって、代わりにこれを使用してください

foreach($children as $child){
    //print_r($child);
    $permalink = get_permalink($child->ID);
    $post_title = strtoupper($child->post_title);
    $initial = getInitials($child->post_title);
    if($initial!='' && $currval != $initial ) {
        $currval = $initial;
        echo '<optgroup label="'.$initial.'""></optgroup>';
    }
    echo '<option value="'.$permalink.'">'.$post_title.'</option>';
}
于 2013-10-12T11:53:37.467 に答える