【jQuery】次の要素を削除・前の要素を削除

次の要素の取得と前の要素のオブジェクトの取得は以下で取得できます。

$('セレクタ名').next();
// 直後がpタグの場合のみ発動
// 指定したいオブジェクトが直後ではない場合はnextAll()を使います
// divでもimgでもそういう系であればなんでも可
$('セレクタ名').next("p");
$('セレクタ名').prev();
// 直前がpタグの場合のみ発動
// 指定したいオブジェクトが直前ではない場合はnextAll()を使います
// divでもimgでもそういう系であればなんでも可
$('セレクタ名').prev("p");

このようにしてオブジェクトを取得することができるので、早速削除しましょう

$('セレクタ名').next().remove();
$('セレクタ名').next("p").remove();
$('セレクタ名').prev().remove();
$('セレクタ名').prev("p").remove();

【php】セッションが消えてしまう問題

セッションに値を格納したが、次の画面に遷移した際にセッションの中身を確認してみると値が入っていないという事象に当たったのでメモします。
session_start関数は「

<?php
session_start();

use hogehoge;
use fugafuga;

ダメだった例

<?php
use hogehoge;
use fugafuga;

session_start();

【php】現在定義されている変数を全て確認したい

get_defined_vars関数を使用することで確認できます。

$arr = get_defined_vars();
var_dump($arr); // 定義済みのすべての変数が出力される。
var_dump($arr["_POST"]); // 定義済み$_POSTのすべての変数が出力される。

【php】AjaxでdataType:'json'が使えない

SyntaxError: JSON Parse error: Unrecognized token '<'

というエラーが出てきて困った。
このエラーを回避するには、html内で

header("Content-Type: application/json; charset=utf-8");

もしくは

header("Content-Type: text/javascript; charset=utf-8");

を記述すればjsonを扱うことができるようになる(私は使うと都合が悪かったです)。

しかしながら、phpを1枚で完結させている場合など、これを使用すると何かと都合が悪いことがある。

AjaxのdataTypeを'JSON'ではなく'text'を指定すれば、おそらく通るようになる。
この場合注意が必要なのが、AjaxでPOSTもしくはGETをした際に動く処理の戻り値が欲しい場合は注意が必要である。

    var data = { hoge: 'huga'};
    $.ajax({
      type: 'POST',
      data: data, // 文字列を指定しても配列を指定してもOK
      dataType: 'text',
      // url: './hogehoge.php', 指定しない場合やurlに誤りがある場合は自分にアクセスされる
    }).done(function(response) {
      alert('response');
    }).fail(function(XMLHttpRequest, textStatus, errorThrown) {
        alert(XMLHttpRequest);
        alert(textStatus);
        alert(errorThrown);
    });

この、responseの部分はAjax先のphpからのレスポンスを受け取る。
しかしながら、何も考えないで処理をさせると、responseの中には現在表示させているHTMLが全て表示されると思う。
そのため、Ajax先でちょうどいいところまで処理をさせてreturnをしてあげる必要がある。
しかしながら、次はreturnをしたはいいけど、responseには何も入っていない。。。という事象に陥る場合は、
変数をechoやvar_dumpすることでresponseに出てくると思う。

if($_POST['hoge'] == 'huga'){
    echo 'huga';
    return;
}

みたいな感じ。

【php】値がセットされていないキーは取り除く

array_filter()関数を使用することで可能。

$arr = array();
$arr['num1'] = 'num1';
$arr['num2'] = '';
$arr['num3'] = 'num3';
var_dump($arr);
var_dump(array_filter($arr));

実行結果は以下。

array(3) { ["num1"]=> string(4) "num1" ["num2"]=> string(0) "" ["num3"]=> string(4) "num3" }
array(2) { ["num1"]=> string(4) "num1" ["num3"]=> string(4) "num3" }

【php】json_encodeで日本語がうまく表示されない

$arr = array('あいう','えお');
echo json_encode($arr);
echo json_encode($arr, JSON_UNESCAPED_UNICODE);

この実行結果が以下のようになる。

["\u3042\u3044\u3046","\u3048\u304a"]
["あいう","えお"]

第二引数に「JSON_UNESCAPED_UNICODE」をつけると日本語がちゃんと表示される。

【js】次の要素を取得・隠す

javascript

<button>非表示へ</button>
<div id="next">これが消えます<div>
function hideNext(e){
  var nextElement = e.nextElementSibling;
  if (nextElement.style.display !== 'none') {
        nextElement.style.display = 'none';
        e.innerHTML = ' 表示 ';
    }
    else {
        nextElement.style.display = 'block';
        e.innerHTML = '非表示';
    }
}

jQuery

<button onclick="hideNext(this)">非表示へ</button>
<div id="next">これが消えます<div>
$(document).ready(function(){
  $("button").click(function() {
    var nextElement = $(this).next();
    var nextId = nextElement.attr("id");
    $("#" + nextId).toggle()
  });
});