常連

注目の的

質問力

プロトタイプは、共有したい関数やプロパティがあるときに利用します。このプロトタイプを利用することを「オブジェクトを初期化する」と表現するサイトを見つけました。
 初期化は、元々あった事物を消し新たにすることと変数に値を代入することという二つの意味で認識しておりますがオブジェクトを初期化するとは、どちらの意味になりますか。或いはまた別に意味があるのでしょうか。

http://language-and-engineering.hatenablog.jp/entry/20080922/1222010471

オブジェクトを初期化する、とは

### cloud9のプレビューを正常に機能させたい

シラバスという学習サービスで簡易2chアプリを作成していました。
最初は普通にプレビューも機能しており学習自体順調に進んでいたのですが
突然プレビュー画面に次のようなメッセージが表示されるようになりました。
直接リンクからアクセスしても結果は同じでした。

![イメージ説明](847bf8d85521b8d34adc3a439dfe5c96.png)

### 発生している問題・エラーメッセージ

$ rails s
でサーバーを起動したところ
=> Booting Puma
=> Rails 5.2.0 application starting in development 
=> Run `rails server -h` for more startup options
Puma starting in single mode...
* Version 3.11.4 (ruby 2.4.1-p111), codename: Love Song
* Min threads: 5, max threads: 5
* Environment: development
* Listening on tcp://localhost:8080
Use Ctrl-C to stop
となってます。

次にPreview →　Preview Running Application
を開くと先の画面が表示されます。

### 試したこと

$ rails s
$ rails s -b $IP -p $PORT
rails s -b 0.0.0.0
を入力しても結果は変わりませんでした。

### 補足情報

OS: windows10
AWSのcloud9を使ってます。

cloud9のPreviewでVFS connection does not existと表示されてしまいます

### 前提・実現したいこと

質問が2つあります。どちらか片方でも答えてくれたら助かります。

PHPとMySQLをつかって、学生登録システムを作っています。

質問1
ーーーーーーーーーーーーーーーーーーーー
条件を入力し、学生の絞り込みをしたいのですが、条件を複数選択した場合うまくいきません。
条件を性別だけ、所属だけ、と単独なら正常処理します。
例、性別→女、所属→文化部、で検索すると花子文化部、のび太文化部が表示されてしまう。

今のプログラムでは所属のif分が最後にあり、所属が優先されるプログラムです。
どうやったら、条件を複数選択しても、正しく絞り込みができるでしょうか？
ーーーーーーーーーーーーーーーーーーーー

質問2
ーーーーーーーーーーーーーーーーーーーー
「運動部」で検索しても、yaruo運動部、一人しか検索されません。
正しい処理は
ruck	ruck@	女	運動部,帰宅部,生徒会,
yaruo	aaa@	男	運動部
yaruo	aaa@	男	運動部生徒会
出木杉	aaa@	男	運動部文化部生徒会
4人検索されるはずです。
この問題の解決方法はどうすればいいでしょうか？
質問2は大幅にプログラムとテーブルを書き換えないと駄目ですね( ;∀;)
ーーーーーーーーーーーーーーーーーーーー
ここに質問の内容を詳しく書いてください。（例）PHP(CakePHP)で●●なシステムを作っています。
■■な機能を実装中に以下のエラーメッセージが発生しました。


### 該当のソースコード

```PHP



<?php

$res = "";  //新しいウェブページのエラー回避

$USER= 'root';
$PW= '1234';
$DBINFO= "mysql:dbname=cwdb;host=localhost;charset=utf8";

try{
    $pdo = new PDO($DBINFO,$USER,$PW); //pdoインスタンスの生成
    $sql = "SELECT * FROM students";

    //$sql = "SELECT * FROM students WHERE student_name LIKE '%山%'";
    if (isset($_POST['freeword'])) {
        $sql = "SELECT * FROM students WHERE student_number LIKE '%{$_POST['freeword']}%' OR student_name LIKE '%{$_POST['freeword']}%' OR email LIKE '%{$_POST['freeword']}%' ";
    }

    if (isset($_POST['sex'])) {
        if ($_POST['sex'] == "男") {
            $sql = "SELECT * FROM students WHERE sex = '男'";
        }elseif ($_POST['sex'] == "女") {
            $sql = "SELECT * FROM students WHERE sex = '女'";
        }
    }

    if (isset($_POST['syozoku'])) {
        if ($_POST['syozoku'] == "運動部") {
            $sql = "SELECT * FROM students WHERE syozoku = '運動部'";
        }elseif ($_POST['syozoku'] == "文化部") {
            $sql = "SELECT * FROM students WHERE syozoku = '文化部'";
        }elseif ($_POST['syozoku'] == "帰宅部") {
            $sql = "SELECT * FROM students WHERE syozoku = '帰宅部'";
        }elseif ($_POST['syozoku'] == "生徒会") {
            $sql = "SELECT * FROM students WHERE syozoku = '生徒会'";
        }
    }

   $stmt = $pdo->prepare($sql);
    $stmt->execute(null);
    $res = "<table border=1>
            <tr>
                <th>学籍番号</th>
                <th>氏名</th>
                <th>メールアドレス</th>
                <th>性別</th>
                <th>所属</th>
                <th>年</th>
                <th>編</th>
            </tr>\n";

    while($row = $stmt->fetch(PDO::FETCH_ASSOC)){

        $res .= <<<eod
        <tr>
            <td>{$row['student_number']}</td>
            <td>{$row['student_name']}</td>
            <td>{$row['email']}</td>
            <td>{$row['sex']}</td>
            <td>{$row['syozoku']}</td>
            <td>{$row['birth_year']}</td>
            <td><a href = "edit.php?seq={$row['seq']}">編</a></td>
        </tr>
eod;
    }

    $res .= "</table>\n";

}catch(Exception $e){
    echo "エラー発生" . $e->getMessage();
}

?>

<!DOCTYPE html>
<html>
<head>
    <title>一覧画面</title>
</head>
<body>

<form method="post" action="regist.php">
    <input type="submit" value="新規登録"></input>
</form>

<p>
    <form method="post">
        条件を絞り込む<br>
        フリーワード<input type="text" name="freeword"><br>
        性別
        <select name="sex">
            <option></option>
            <option value="男">男</option>
            <option value="女">女</option>
        </select><br>

        所属
        <select name="syozoku">
            <option></option>
            <option value="運動部">運動部</option>
            <option value="文化部">文化部</option>
            <option value="帰宅部">帰宅部</option>
            <option value="生徒会">生徒会</option>
        </select><br>

        <input type="submit" value="検索する"></input>
    </form>
</p>

<form>
    <input type="submit" value="全員表示"> 
</form><br>

<?php echo $res; ?>



</body>
</html>
```

![イメージ説明](edc63a0d7fd826fdcedbbb6393cf572a.png)

![イメージ説明](29b7d69c0bb72d7888f61d86fdd99e9a.png)

![イメージ説明](8845401bb5b75653d9e7a8aed55c68df.png)

絞り込み検索 複数 データベース

[https://itsakura.com/jquery-ajax#s4](https://itsakura.com/jquery-ajax#s4)
こちらのサイトを参考にといいますかまず
全部コピペして
mamp/htdocs/json/index.php
にファイルを作成しました。
これはうまくいきました。（当たり前ですが）

次に
```js
$.ajax({  
    url:'http://httpbin.org/post', // 通信先のURL
    type:'POST',    // 使用するHTTPメソッド (GET/ POST)
    data:$("#form1").serialize(), // 送信するデータ
    dataType:'json', // 応答のデータの種類 
```
という部分を
```js
$.ajax({  
    url:'/json/', // 通信先のURL   **ここを変えました。**
    type:'POST',    // 使用するHTTPメソッド (GET/ POST)
    data:$("#form1").serialize(), // 送信するデータ
    dataType:'json', // 応答のデータの種類 
```
すると結果が
parsererror
になってしまいます。

試したもの
/json/index.php ←これにするとparsererror(200)
/json/ ←これにするとparsererror(200)
json/index.php ←これにするとerror(404)
json/ ←これにするとerror(404)

MAMP上では不可能ということでしょうか？
ご教示宜しくお願いします。

```php
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>jqueryのajaxのサンプル</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$( function() {

$('#btn1').click(
function(){
  $("#out6").html("データ取得中です");

  // 1.$.ajaxメソッドで通信を行います。
  //  dataでは、フォームの内容をserialize()している
  //  →serialize()の内容は、cs1=custom1&cs2=custom2
  $.ajax({  
    url:'/json/post', // 通信先のURL
    type:'POST',    // 使用するHTTPメソッド (GET/ POST)
    data:$("#form1").serialize(), // 送信するデータ
    dataType:'json', // 応答のデータの種類 
            // (xml/html/script/json/jsonp/text)
    timeout:1000,     // 通信のタイムアウトの設定(ミリ秒)

    // 2. doneは、通信に成功した時に実行される
    //  引数のdata1は、通信で取得したデータ
    //  引数のtextStatusは、通信結果のステータス
    //  引数のjqXHRは、XMLHttpRequestオブジェクト
    }).done(function(data1,textStatus,jqXHR) {
        $("#out1").html(jqXHR.status); //jqXHR.statusを表示
        $("#out2").html(textStatus); //textStatusを表示

        // 3. キーを指定して値を表示 
        $("#out4").html(data1["form"]["cs1"]);

        // 4. オブジェクトをJSON形式の文字列に変換
        var data2 = JSON.stringify(data1);
        console.log(data2); //コンソールにJSON形式で表示される

        // 5.JSON形式の文字列をオブジェクトにし、
        // キーを指定して値(httpbin.org)を表示
        var data3 = JSON.parse(data2);
        $("#out5").html(data3["headers"]["Host"]);

    // 6. failは、通信に失敗した時に実行される
    }).fail(function(jqXHR, textStatus, errorThrown ) {
        $("#out1").html(jqXHR.status); //jqXHR.statusを表示
        $("#out2").html(textStatus); //textStatusを表示
        $("#out3").html(errorThrown); //errorThrownを表示

    // 7. alwaysは、成功/失敗に関わらず実行される
    }).always(function(){
        $("#out6").html("complete"); //表示3
        
  });
});
});
</script>
</head>
<body >
<p>jqXHR.statusを表示：<span id="out1"></span></p>
<p>textStatusを表示：<span id="out2"></span></p>
<p>errorThrownを表示：<span id="out3"></span></p>
<p>表示1：<span id="out4"></span></p>
<p>表示2：<span id="out5"></span></p>
<p>表示3：<span id="out6"></span></p>

<p>ボタンを押すと通信が始まります</p>

<form id="form1">
<input type="button" id="btn1" value="ボタン1"><br/>
テキストボックス１<br/>
<input type="text" name="cs1" value="custom1" maxlength="10"><br/>
テキストボックス２<br/>
<input type="text" name="cs2" value="custom2" maxlength="10">
</form>
</body>
</html>
```

追記
url部分をhttp://httpbin.org/post
にもどすと
```json
{"args":{},"data":"","files":{},"form":{"cs1":"custom1","cs2":"custom2"},"headers":{"Accept":"application/json, text/javascript, */*; q=0.01","Accept-Encoding":"gzip, deflate","Accept-Language":"ja,en-US;q=0.9,en;q=0.8"...}
```
のようなものが帰ってきていることは確認できるのですが、
上記のphp内の<script>を
mamp/htdocs/json/json.jsを作りそちらに記述し、
直接URLを打ち込んでみましたがconsole内にはなにも表示されませんでした…

```js
$( function() {

$('#btn1').click(
function(){
  $("#out6").html("データ取得中です");

  // 1.$.ajaxメソッドで通信を行います。
  //  dataでは、フォームの内容をserialize()している
  //  →serialize()の内容は、cs1=custom1&cs2=custom2
  $.ajax({  
    url:'http://httpbin.org/post', // 通信先のURL
    type:'POST',    // 使用するHTTPメソッド (GET/ POST)
    data:$("#form1").serialize(), // 送信するデータ
    dataType:'text', // 応答のデータの種類 
            // (xml/html/script/json/jsonp/text)
    timeout:1000,     // 通信のタイムアウトの設定(ミリ秒)

    // 2. doneは、通信に成功した時に実行される
    //  引数のdata1は、通信で取得したデータ
    //  引数のtextStatusは、通信結果のステータス
    //  引数のjqXHRは、XMLHttpRequestオブジェクト
    }).done(function(data1,textStatus,jqXHR) {
        $("#out1").html(jqXHR.status); //jqXHR.statusを表示
        $("#out2").html(textStatus); //textStatusを表示

        // 3. キーを指定して値を表示 
        $("#out4").html(data1["form"]["cs1"]);

        // 4. オブジェクトをJSON形式の文字列に変換
        var data2 = JSON.stringify(data1);
        console.log(data2); //コンソールにJSON形式で表示される

        // 5.JSON形式の文字列をオブジェクトにし、
        // キーを指定して値(httpbin.org)を表示
        var data3 = JSON.parse(data2);
        $("#out5").html(data3["headers"]["Host"]);

    // 6. failは、通信に失敗した時に実行される
    }).fail(function(jqXHR, textStatus, errorThrown ) {
        $("#out1").html(jqXHR.status); //jqXHR.statusを表示
        $("#out2").html(textStatus); //textStatusを表示
        $("#out3").html(errorThrown); //errorThrownを表示

    // 7. alwaysは、成功/失敗に関わらず実行される
    }).always(function(){
        $("#out6").html("complete"); //表示3
        
  });
});
});
```

【ajax】$.ajaxで通信を行ってJSONを取得したい

gulpのグローバルインストール派とローカル派、両方派に割れているようですが、
小規模サイト制作ならどちらが良いと思いますか？

ローカルですでに入れてしまったのですが、初心者なので詳しことはわかりませんが、
新しいプラグインを使うたびに毎度パスを通すような作業が必要になっているようです。

グローバルも入れたほうが便利でしょうか？
その際そのままnpm install gulp -gを打つだけでよいでしょうか？

そうするとどこでも実行できるようになると考えてよいのでしょうか？


初心者にわかるように教えていただける方に回答お願いします。


またベンダープリフィックスの付与はサブライムのプラグインでやっていますが、
こちらのほうが良いですか？
いちいち場所を指定しなくてもいっぺんにすべて行ってくれるのでしょうか？

gulpのグローバルインストール派とローカル派、両方派に割れているようですが、 小規模サイト制作ならどちらが良いと思いますか？

ウェブサイトでローディング画面を最初にアクセスした時、更新した時にのみ表示し
サイト内の別ページから戻る時は表示しないようにしたいです。
Cookieやwebstorageなどもあると思いますが、ディレクトリのパスを使ってみて
上手くいかなかったので解決法あれば教えてください。
下記のままだと、ローディングが毎回でてしまいます。

ディレクトリになります。
Homeフォルダ
　｜---index.html
　｜---Companyフォルダ --- index.html


↓Homeの中のhtmlとjs
```HTML
<body>
　<div class="loading"></div>
　<div class="wrap">
　//中身　
　</div>
</body
```


```JS
$(function(){
  const host = $(location).attr('pathname');
  if(host !== "/company/index.html"){　　//カンパニーページから来ない場合
    $(function() {　　//ローディングページ
      var h = $(window).height();
      $('.wrap').css('display','none');
      $('.loading').height(h).css('display','block');
    });
    $(window).load(function () {   //全ての読み込みが完了したら実行
      $('.loading').delay(1400).fadeOut(900);
      $('.wrap').css('display', 'block');
    });
  };

//10秒たったら強制的にロード画面を非表示
$(function(){
  setTimeout('stopload()',10000);
});
function stopload(){
  $('.wrap').css('display','block');
  $('.loading').delay(1200).fadeOut(800);
  };
});
```

ローディング画面を最初と更新後にのみ表示する。（リファラ使用）

### 実現したいこと

現在WordPressを利用してウェブサイトの構築を行っております。
ローディング画面を実装したのですが、現状はページが更新されるたびに処理が発生しております。
そこで、外部からのアクセス時~~（初回アクセス時）~~のみローディング画面を発生させたいです。

古い記事ではあるのですが、下記記事を参考に
[jQueryで「jquery.cookie.js」を使ってページの初回アクセスのみ処理を変える方法](http://black-flag.net/jquery/20111115-3552.html)

を読み、jquery.cookie.jsを用いて、記事のサンプルをそのまま利用しても機能しない状態です。

また、私自身javascriptの知識がないに等しいため、紹介記事等を参考に組んでおります。
どなたか初回アクセス時のみ以下の処理を行うorローディング画面を発生させる方法をご教授いただけないでしょうか。
よろしくお願いいます。


### 該当のソースコード

```
<script type="text/javascript">
var time=new Date().getTime();
$(function() {
  var h = $(window).height();

  $('#loader-bg ,#loader').height(h).css('display','block');
});

//全ての読み込みが完了したら実行
$(window).on('load',function () {
  var now = new Date().getTime();
  if (now-time<=3000) {
    setTimeout('stopload()',5000-(now-time));
    return;
  } else {
    stopload();
  }
});

//5秒たったら強制的にロード画面を非表示
$(function(){
  setTimeout('stopload()',5000);
});

function stopload(){
  $('#loader-bg').delay(900).fadeOut(800);
  $('#loader').delay(600).fadeOut(300);
}
</script>
```
現在は上記コードでローディング画面の発生・終了までは処理できております。

よろしくお願いいたします。



---追記---

Jqueryのバージョンや、Cookie.jsを使用した際のコードを書いたほうがいいとのご指摘をいただいたので、
追記させていただきます。

【ブラウザ】
GOOGLE Chrome
（バージョン: 67.0.3396.99（Official Build） （64 ビット））

【jQuery】
jquery-3.3.1.min.js

### 参考サンプルを記述したもの

```
<script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/jquery.cookie.js"></script>
<script type="text/javascript">
$(function(){
  if($.cookie("access")){
    $('#first').css({display:'none'});
  }
  $(window).load(function(){
    $.cookie("access",$('body').addClass('access'));
  })
});
</script>
```

以上よろしくお願いいたします。


---追記---

外部からのアクセス時（初回アクセス時）のみ
と書いてありますが、私の説明不足でした。

主にページ内の内部リンクを対象と考えております。
トップページに直接アクセスした際にはローディング画面を表示。
サブページ等からトップページにアクセスした際にはローディング画面を非表示

と考えております。
私の記載内容がまとまっておらず、ご迷惑おかけしましたことおお詫び申し上げます。

初回アクセス時のみローディング画面を表示する方法について

演算子と制御文を一通り終え関数に入ったのですがjsのreturnの使い方がいまいち理解できません

```lang-＜javascript＞
function menseki(r){
  var m = 3.14 * r * r;
  return m;
}ｗ

var m = menseki(5);
```

自分なりに考えてみたのですが、処理を終えたり新しい処理を始める前にreturnを使うのでしょうか...

それともbreakやcontinueのように一定の処理を飛ばしたり無効にするためにつかうのかわかりません値を返すというのが理解できません。。どこに返しているのですか？

初歩的なことを質問してすみません。。
どなたか教えてください

javascriptのreturnの使い道が理解できません...

JavaScriptで下記のような処理を行いたいと思っています。
(1)ボタンを押下するとモーダルウィンドウが開く。
(2)モーダルウィンドウ内のボタンを押下すると、モーダルウィンドウ内にローディングバーが表示される。
(3)バックグラウンドでAjax(同期通信)を行う。
(4)(3)の通信完了後、モーダルウィンドウが自動で閉じる。

この部分の処理がどうしても下記のようになってしまい、困っています。
(1)ボタンを押下するとモーダルウィンドウが開く。
(2)モーダルウィンドウ内のボタンを押下すると、ローディングバーが表示されないままAjax通信が実行される。
(3)通信完了後、モーダルウィンドウが自動で閉じる。

プログラムは下記のように書いています。
(業務で書いているプログラムなので、業務にかかわる部分は伏せて書かせていただきます。
分かりづらいところなどございましたら申し訳ありません。)

```JavaScript
    // (1)のモーダルをDOMで作成
    var select = $("<select>").addClass("col-xs-12");
    $.each(foo, function(hoge, fuga) {
        select.append($("<option>").val(hoge).text(fuga));
    });
    var modal = $("<div>");
    modal.append(select);

    modal.dialog({
        "modal":true,
        "draggable":false,
        "closeOnEscape":false,
        "buttons": [
            {
                text: "通信開始",
                type: "button",
                click : function() {
                    var hoge = function() {
                        var loading = $("<div>")
                        .addClass("progress progress-striped active")
                        .append($("<div>")
                            .addClass("progress-bar")
                            .css("width", "100%")
                        );
                        $(".ui-dialog-content").prepend(loading);
                    }
                    $.when(
                        hoge()
                    ).done(function() {
                        // ajax通信(同期通信)の処理
　　　　　　　　　　　　　hogehoge();

                        // ウィンドウを閉じる
                        $(this).dialog("destroy").remove();
                    });
                }
            },
            {
                text: "キャンセル",
                type: "button",
                click : function() {
                        // ウィンドウを閉じる
                	$(this).dialog("destroy").remove();
                },
            },
        ]
    });
```

`.done()`処理内の`$(this).dialog("destroy").remove();`を削除したところ、下記のような動作となったため、
標題の「$.whenの中で行っているDOM操作が後から実行される」という動きになっていることが判明しました。
(1)ボタンを押下するとモーダルウィンドウが開く。
(2)モーダルウィンドウ内のボタンを押下すると、ローディングバーが表示されないままAjax通信が実行される。
(3)Ajax通信完了後、ローディングバーが表示される。

なお、`$.when`の中に`alert('hoge');`や`console.log('hoge');`を記載した場合、
Ajax通信の前にそちらが実行されますので、DOM操作だけが実行されないようです。
また、同期通信の箇所を非同期通信にしても結果は変わらなかったため、同期通信が原因というわけでもないのかな…と考えております。

「こういうところが原因ではないか」というようなヒントやアイデアだけでもいただけると幸いです。
よろしくお願いいたします。

JavaScript $.whenの中で行っているDOM操作が後から実行される

以下のような形でwhenとdoneを使っています。

$(function(){
	$.when(function(){
		for(i=0; i>=5; i++){
			色々処理
			hoge[i] = 処理した値;
		}
	})
	.done(function(){
		$.ajax({
			type: "get",
			url: (test.php),
			data: {"hoge" : hoge},
			success: function(s){
				document.write(s);
			}
		});
	});
});

挙動として、whenが終わってからdoneが実行されると思っていたのですが、
「色々処理」の部分の動作が重いせいか、まったく動きません。

whenの部分でsetTimeoutを使って、処理が終わると思わしき時間待たせてからでないと、
リアルタイムで処理が終わってから動く、という挙動をさせることはできないのでしょうか？


ご教授いただければ幸いです。

jqueryのwhenとdoneの挙動

###前提・実現したいこと
Webサイトで全てのページのURLのファイル名を非表示にしたいです。
以下のようなイメージです。
![イメージ説明](c560c6a7e2b410eebc0e33aa5e1d2d02.png)

###試したこと
全てのファイルをindex.phpにすることで、非表示にはできたのですが、
これだとファイル名が全部一緒で、どのファイルを作業しているのかすごくわかりにくいですし、
また、http://localhost:8888/hp/2016/07/university/index.phpと直にURLを打ち込んだときに表示されてしまいます。
![イメージ説明](25b6a1a66ed6172d938572cc10d22e1c.png)


フォルダ構成
```
├── index.html  //トップページ
│
├── access
│      └── index.html
├── blog
│      └── index.html
├── concept
│      └── index.html
├── menu
│      └── index.html
└── topics
         └── index.html
```

###具体的にやりたいこと
以下2点のようなことをやりたいのですが、お力を貸していただきたく質問させていただきました。

・同じファイル名ばかりで混同しないようにしたい。
・localhost:8888/hp/2016/07/university/index.phpとURLを直に打ち込んだときでも
localhost:8888/hp/2016/07/university/とURLが表示されるようにしたい。

###実行環境/バージョン
テスト環境
MAMP 3.1
本番
さくらのレンタルサーバースタンダートプラン

Webサイトで全てのファイルのURLを非表示にしたい

###前提・実現したいこと
現在地を取得してマッチしたURLを持ったローカルナビのリストにクラスを付与したい。

1 現在のURLを取得。
2 #localNavの中のa要素のhref属性に、1で取得したURLと同一の物を探す。
3 マッチした要素があったら、そのURLを持つ親のliにクラスcurrentを付与する。

ちなみに現在のjsコードは中途半端ですが、a要素href属性に、現在のURLとマッチする物があったらliにクラスを付与する（全部）となっています。

###発生している問題・エラーメッセージ
現在URLとローカルナビ内のhrefの取得までうまくいったのと思うのですが、
マッチしたhrefが見つかった場合のliへのクラス処理の方法がわかりません。

###該当のソースコード
```
<ul id="localNav">
<li><a href="/aaaa/bbbbbbbbbb/index.html">テキスト</a></li>
<li><a href="/aaaa/bbbbbbbbbb/ccc01.html">テキスト</a></li>
<li><a href="/aaaa/bbbbbbbbbb/ccc02.html">テキスト</a></li>
<li><a href="/aaaa/bbbbbbbbbb/ccc03.html">テキスト</a></li>
<li><a href="/aaaa/bbbbbbbbbb/ccc04.html">テキスト</a></li>
<li><a href="/aaaa/bbbbbbbbbb/ccc/index.html">テキスト</a></li>
</ul>

<script>
var nav = document.getElementById('localNav'),
    child = nav.getElementsByTagName('a'),
    path = location.pathname.slice(16); // 現在のパス16番目以降取得
    for(var i = 0; i < child.length; i++){
        var href = child[i].getAttribute('href').slice(16); //a要素のhrefのURL16番目以降を配列で取得
        if(href === path){
            for(var j = 0; j < nav.children.length; j++){
                nav.children[j].classList.add('current');
            }
        }else{
        }
    }
</script>

```

###試したこと
href自体は配列で取得されているはずなので、マッチした配列番号に対してクラスを振るなど考えましたが、そもそも配列番号を取得する方法がわかりませんでした。

###補足情報(言語/FW/ツール等のバージョンなど)
.slice()でURLを取得していますが、下2階層のURL取得方法でいい方法があれば教えてください。
こういう書き方の方が良いなどあれば大歓迎です。

javaScriptで現在のURLを取得して該当するローカルナビにクラスを付与したい。

レスポンシブサイトの制作でウィンドウリサイズ時に画面のリロードを行いたいのですが、下記のようなコードで実装しようとしたところFirefoxでのみエラーが出てしまいリロードがされません。
```ｊQuery
	$(document).ready(function(){
		var timer = false;
		$(window).on("load resize", ReLayout);
		function ReLayout() {
			if(event.type == 'resize') {
				if (timer !== false) {
					clearTimeout(timer);
				}
				timer = setTimeout(function() {
					location.href = location.href;
				}, 200);
			}
		}
	});
```
原因が5行目の
```jQuery
if(event.type == 'resize')
```
にありそうだということはわかったのですが、どのように書き換えればいいのかわからず…。
どこをどのように直せばいいのかご教示いただけると助かります。どうぞよろしくお願いします。

jQueryでウィンドウリサイズ時に画面のリロードを行いたいのですが、Firefoxでのみエラーが出ます。

word-input.php
```php:word-input.php
<form action="word-output.php" method="post">
<input type="text" name="word">
<input type="submit" value="確定">
</form>
```

word-output.php
```php:word-output.php
<?php
$word = $_POST['word'];
if(preg_match('/[a-z]\-\d{3}/', $word)){
	echo 'ok';
}else{
	echo 'NG';
}
?>
```

/[a-z]\-\d{3}/
/[a-z]-\d{3}/

どちらで書いても同じ意味でした。

確かハイフンは\-としないといけないと
本に書いてありました。
なぜ
/[a-z]-\d{3}/
が通じるのでしょうか。

PHP preg_matchでハイフンを表現

the_contentの中から特定のタグ（たとえば画像タグ）などを全て（複数あることが前提）抽出し、
それぞれのタグにカスタムを加えて、元の位置に置き換える方法を考えています。

たとえば、下記のような感じです。
<a href=~><img src=~ /></a>
↓
<div class=~><a href=~><img src=~ /></a></div>


preg_match_allなどであれこれ試していたのですが、思うようなカタチにならず質問させていただきました。
実装できる方法を具体的に教えていただけると助かります。

※クラス付与だけの場合は専用の関数フック等でできるようですが、今回はまるっと置き換えできる方法をさがしています。

PHP WordPress本文内の特定のタグを複数置き換えしたい

WordPressの最新バージョンでWordPressサイトの構築をしています。

WordPressは、imgタグに対してpタグが自動で囲まれる仕様ですが、pタグを削除してdivタグで記事内のimgタグを囲みたいです。

functions.phpにどのように書けば実現可能でしょうか。どうか、お力添えをよろしくお願いします！

WordPress 記事内のimgタグをdivタグで囲みたい

初めて質問させて頂きます。
現在Cloud9を使ってPHPコーディングの学習を進めているのですが、
先日「独習PHP 第3版」という書籍を購入し、そこに書かれているいくつかのサンプルコードを試してみたところ、何やら正常に動作しないものがあり、
現在のPHPのバージョンをコマンド php -vで調べてみたところ、5.5.9でした。
そこでPHP7をインストールをしようと思い、ネット検索して見たところ、手順を紹介しているサイトに行き着いたので、phpbrewの使い方もよくわからないため、コピペによるコマンド入力に頼り、インストールを進めてみました。
打ったコマンドは以下の順です。

sudo apt-get update
sudo apt-get install libmcrypt-dev
phpbrew lookup-prefix ubuntu
Y
phpbrew install 7.0 +default

ここまでうまくいった(?)らしく、
以下、

To use the newly built PHP, try the line(s) below:

    $ phpbrew use php-7.0.20

Or you can use switch command to switch your default php to php-7.0.20:

    $ phpbrew switch php-7.0.20

Enjoy!

と表示を確認することが出来たのですが、
いざ、バージョンを切り替えようと、

phpbrew switch php-7.0.20

と打ち込むと、

Invalid argument php-7.0.20

のように表示されてしまい、これ以降の手順がわからなくなってしまいました。

phpbrew use php-7.0.20

でも同様に、赤字で、

Invalid argument php-7.0.20

と表示されてしまいます。

本の方ではXAMPPを使った学習方法が紹介されているのですが、いっそCloud9よリもXAMPPを利用した方が簡単なのでしょうか？

PHPの学習を本格的に始めてより、まだ１ヶ月程なので、わからないことだらけなのですが、
環境構築でつまづいてしまい、なかなか先に進めない状況です。

解答頂けると幸いです。

Cloud9を使ってPHPバージョン７以降の実行環境の構築について

**●今回の質問の状況をまずは簡潔に書かせていただきます。
①wordpressサイトをデザインリニューアルをします。
②wordpressは新しいものをダウンロードしデータベースの情報の移動などはありません。
③旧サイトの独自ドメインを新しいサイトで使用したいです。
④サーバーは旧サイトで使っていたものと同じです（Hostinger)。
⑤公開中のサイトは新しいサイトができるまで公開したままにしたいそうです。**
****************************************************************************************************************

現在wordpressサイトのリニューアルをしようと思っているのですが、リニューアル前のファイル構造が、わたしよりも素人の方が管理していたので複雑でよくわからないwordpressと関係ないファイルが入っていたりするので、今までのブログ数も大変少ないので、全く新しくデータベースの移動などもなくリニューアルしようと思っています。

ただ前提条件としてわたくし自体もwordpressを触るのは初めてです。

今回は新しいwordpressを古いサイトと同じサーバー上にダウンロードしていちから作成していくつもりです。
この場合ダッシュボードの一般設定で古いサイトのダッシュボードのサイトアドレス (URL)を他のものにして、新しいサイトのダッシュボードのサイトアドレス (URL)に古いサイトで使用していたドメイン名を記入すればよいのでしょうか？

リニューアル作業が完了するまでは現在の古い方のサイトを公開したままにしておきたいそうです。

また今回のようにドメイン名を移動した場合検索されるようになるまでに時間がかかったり何か手続きする必要はあるのでしょうか？

色々とご意見いただけると助かります。

**＜質問＞
①旧サイトの独自ドメインを新しいサイトのドメインに移動する方法は？
②移動後は何か手続きが必要ですか？
③検索できるようになるまでに時間がかかりますか？**

wordpressサイトのドメイン移動

###前提・実現したいこと
PHP・サーバ周りに関して素人のWebデザイナーです。

Wordpressのファイルアップロード上限を2MBから20MBへ引き上げたいです。

###発生している問題・エラーメッセージ
管理画面からでは変更できなかったため、
php.iniを作成し上限が20MBになるように記述しました。
phpinfo.phpで確認したら、反映されていました。

しかし、Wordpressの管理画面では上限2MBのまま、変わりません。
2.9MBのファイルをアップロードしようとしたら弾かれてしまいました。
```
エラーが発生しました。
アップロードしたファイルは php.ini で定義された upload_max_filesize を超過しています。
```

###該当のソースコード
```ini
cgi.force_redirect = 0

post_max_size = 50M
memory_limit = 40M
upload_max_filesize = 20M
```

###試したこと
上限の数字を30や40などに変えてみましたが、変わりませんでした。

###補足情報(言語/FW/ツール等のバージョンなど)
レンタルサーバーはGMOクラウドのiCLUSTA+です。
Wordpressのバージョンは4.5.3です。

Wordpressのアップロード上限をphp.iniで変更したい

初めましてこんにちは。
javascriptの.slideToggle()が何度も実行されて、開閉が何度も起こる事態について質問させていただきます。
これは、何度もクリックしたときにその回数分開くのをstop()で止めたいという種類のものではありません。

したいことは、サイドナビゲーションを、userのスマホやタブレットとそれ以外によって条件分岐をし、更に画面サイズ（800px）で条件分岐をします。800px未満の場合は、サイドナビゲーションのSIDENAVI以外の部分を閉じた状態にし、SIDENAVI の部分をクリックしたとき、それ以下のリスト部分を開閉させ、800p以上の場合は、全部開いた状態にします。
閉じた状態が初期状態の場合（800px未満）は、.oc-markの文字を、リストが閉じているときは"開"、開いているときは"閉"にします。開いた状態が初期状態の場合（800px以上）は、クリックで開閉させず、"開"も"閉"も表示させません。（開、閉の非表示は、javascriptを使わず、cssで実装しています。）また、スマホが回転されたときやPCでブラウザの幅をリサイズされたときに、画面サイズを再度取得し、それに合わせてコンテンツを表示しています。

問題は現在の状態だと、
スマホの場合、回転させていない場合は意図通りクリックで開閉してくれるのですが、**一度画面を回転させると、開いて閉じる**、という動作になり、**二度目回転させると、開いて閉じて開く、**という状態になります。さらに何度も回転させていると、一度のクリックで、その回転させた回数分開閉を繰り返します。
PCの場合は、どこかの時点で画面をリサイズし、800px未満に一度なると、そのあと画面を広げて800px以上にして、サイドメニューが常に表示される状態になってほしくても、開いた状態にはなるのですが、クリックで開閉されてしまいます。さらにこちらも一度のクリックで何度も開閉を繰り返すようになります。

javascriptのコメントアウトの部分は、この何度も開閉する状態を回避するために、回転やリサイズされた際に強制的にリロードさせていたのですが、今回、ビデオやオーディオといったコンテンツを配信することにしましたので、スマホの回転や画面サイズ変更のたびにリロードしていると、再生していたコンテンツも一緒にリロードされてしまい、継続的に再生できない事態になりますので、リロードさせることができなくなりました。

初心者の域を出ておらず、効率的なコードの組み方がわからないため、大変恥ずかしい状態ではありますが、解決策がありましたら、ご教授いただきたいと思い、投稿いたしました。
下記が使用しているHTMLとjavascriptです。

どうぞよろしくお願いいたします。



```HTML
<nav class="side-navigation">
  <h2>
    <span class="toggle-text">SIDENAVI
      <span class="oc-mark">開</span>
    </span>
  </h2>
  <ul class="sidenavi-contents">
    <li>
      <h3>見出し</h3>
    </li>
    <li class="sidenavi-list">
      <a>りすと１</a>
    </li>
    <li class="sidenavi-list">
      <a>りすと２</a>
    </li>
    <li class="sidenavi-list">
      <a>りすと３</a>
    </li>
    <li class="sidenavi-list">
      <a>りすと４</a>
    </li>
    <li class="sidenavi-list">
      <a>りすと５</a>
    </li>
  </ul>
</nav>
```

```javascript

$(document).ready(function() {
    "use strict";

    var $ua = navigator.userAgent;
    $(function() {

        if ($ua.indexOf('iPhone') > 0 || $ua.indexOf('iPad') > 0 || $ua.indexOf('iPod') > 0 || $ua.indexOf('android') > 0 || $ua.indexOf('BlackBerry') > 0 || $ua.indexOf('windows Phone') > 0 || $ua.indexOf('NOKIA') > 0 || /Mobile.*Firefox/.test($ua)) {

            $(window).on("load orientationchange", Fitsizem);

            function Fitsizem() {
                var _width = $(window).width();

                if (_width <= 800) {

                    $(".side-navigation .sidenavi-contents").hide();
                    var flg = "close";

                    $(".side-navigation h2").click(function() {
                        var snavtglpart = $(".side-navigation .sidenavi-contents");
                        var sntexchange = $(".side-navigation h2 .toggle-text .oc-mark");

                        snavtglpart.slideToggle();

                        if (flg === "close") {
                            sntexchange.text("閉");
                            flg = "open";
                        } else {
                            sntexchange.text("開");
                            flg = "close";
                        }
                    });

                } else {
                    $(".side-navigation .sidenavi-contents").show();
                }
            }
            /*
            var timer;
            $(window).on("orientationchange", function() {
                clearTimeout(timer);
                timer = setTimeout(function() {
                    location.reload(true); 
                }, 100);
            });
            */

        } else {

            $(window).on("load resize", Fitsizepc);

            function Fitsizepc() {
                var _width = $(window).width();

                if (_width <= 800) {

                    $(".side-navigation .sidenavi-contents").hide();
                    var flg = "close";

                    $(".side-navigation h2").click(function() {
                        var snavtglpart = $(".side-navigation .sidenavi-contents");
                        var sntexchange = $(".side-navigation h2 .toggle-text .oc-mark");

                        snavtglpart.slideToggle();

                        if (flg === "close") {
                            sntexchange.text("閉");
                            flg = "open";
                        } else {
                            sntexchange.text("開");
                            flg = "close";
                        }
                    });

                } else {
                    $(".side-navigation .sidenavi-contents").show();
                }
                /*
                var timer = false;
                $(window).resize(function() {
                	if (timer !== false) {
                		clearTimeout(timer);
                	}
                	timer = setTimeout(function() {
                              location.reload(true); 
                	}, 200);
                });
                */

            }
        }
    });
});
```