IEは、accept-charset だけでは動作しません 厳密に言うと、accept-charset だけで動作するのは UTF-8 のみです。他のキャラクタセットでも動作させるには、document.charset も同時に変更して同じにする必要がありました。 で、余談として FORM 内に submit という id を持つボタンを作って実行すると、jQuery の submit が動作しなくなるという現象が起きました。これも、他でも起こっている事をインターネット上で既に見かけていました。 送信直前に変更している内容 1) PHP に渡す為の hidden フィールドの値 ( これで新しいページのキャラクタセット決定 ) 2) どの IFRAME に送るかを決める target 属性 3) 変換先のキャラクタセットである accept-charset属性 4) IE の場合だけ、document.charset を変更して、送信後には元に戻す 以下のコードを見ていただいたほうが、解りやすいと思います。結局、HTML での操作は無理があります。スクリプトで変更する事によって全てのブラウザで動作するはずです。( ただ、IE11 でのエミュレーションでしかテストしていないので、実際の IE8 等の動作はまだ未確認です )
<script>
if ( !window.jQuery ) {
if ( typeof window[window.location.hostname+'.loadjQuery'] === 'undefined' ) {
if ( window.addEventListener ) {
window[window.location.hostname+'.loadjQuery'] = '//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js';
}
else {
window[window.location.hostname+'.loadjQuery'] = '//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js';
}
}
document.write("<"+"script src=\"" + window[window.location.hostname+'.loadjQuery'] + "\"></"+"script>");
}
</script>
<script type="text/javascript">
$( function() {
$('#submit').click(function() {
// IE 判定用
var userAgent = window.navigator.userAgent.toLowerCase();
var saveCharset = document.charset;
// UTF-8 で utf8 IFRAME に送信
$('#charset').val("utf-8");
$('#target').attr("target", "utf8");
$('#target').attr("accept-charset", "UTF-8");
$('#target').submit();
// EUC-JP で ujis IFRAME に送信
$('#charset').val("EUC-JP");
$('#target').attr("target", "ujis");
$('#target').attr("accept-charset", "euc-jp");
if (userAgent.indexOf("msie") > -1 || userAgent.indexOf("trident/7.0") > -1) {
document.charset = 'euc-jp';
}
$('#target').submit();
// SHIFT_JIST で sjis IFRAME に送信
$('#charset').val("SHIFT_JIS");
$('#target').attr("target", "sjis");
$('#target').attr("accept-charset", "shift_jis");
if (userAgent.indexOf("msie") > -1 || userAgent.indexOf("trident/7.0") > -1) {
document.charset = 'shift_jis';
}
$('#target').submit();
// IE の場合だけ元に戻す
if (userAgent.indexOf("msie") > -1 || userAgent.indexOf("trident/7.0") > -1) {
document.charset = saveCharset;
}
});
});
</script>
<pre>
▼ JavaScript による送信ボタン
<input id="submit" type="button" value="送信">
<form id="target" method="post" action="http://winofsql.jp/charset.php">
▼ 本来は非表示ですがテストなので readonly(送信すると３回使われるので表示されるのは SHIFT_JIS)
<input type="text" id="charset" name="charset" readonly>
<textarea
style='width:400px;height:100px;'
name="text"
>あいうえお</textarea>
</form>
▼ utf-8
<iframe style='width:400px;height:100px;' name="utf8"></iframe>
▼ euc-jp
<iframe style='width:400px;height:100px;' name="ujis"></iframe>
▼ shift_jis
<iframe style='width:400px;height:100px;' name="sjis"></iframe>
</pre>
▼ charset.php
<?php
header( "Content-Type: text/html; Charset={$_POST['charset']}" );
header( "Expires: Wed, 31 May 2000 14:59:58 GMT" );
?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=<?= $_POST['charset'] ?>">
</head>
<body>
<pre>
<?= $_POST['text'] ?>
</pre>
</body>
</html>
▼ JavaScript による送信ボタン▼ utf-8 ▼ euc-jp ▼ shift_jis
|
|
【jQueryの最新記事】
- jQuery の $.get を使用した ajax のテンプレート
- jquery.balloon.js を使用した簡単なバルーン( マウスオーバーで表示する追加説明用 )の作り方
- jQuery による link 要素の追加と削除を bootstrap.css でリアルタイムチェック
- FileReader で、ローカルの CSV を読み込んで(shift_jis)、jQuery でテーブルを作成して表示する
- jQuery + bootstrap.js で ajax の GET と POST を使用した DB テーブルを更新する UI テンプレート
- jQuery : 貼り付けるだけで、ページ右下にページ先頭にジャンプするリンクを表示させる( アニメーションは無し )
- STYLE 要素を追加して、CSS テキストをセットして、jQuery で CSS に important 指定を追加する。
- ページの右下に、ページの先頭へ移動するボタンを追加する(ページの先頭から 200px までは、スクロールボタンを表示しない)
- テーブルのTDをクリックしたら、INPUT で値を変更可能にして、元の値と違うものにはフラグを立てる処理を絵で書いて説明してみました
- jQuery を使用してサーバから取得した JSON データを元にテーブルを作成し、その後から列を加工する
- JSON 配列を WEB より読み出して jQuery で動的にテーブルを作成して表示する
- jQuery UI の Datepicker Widget のオプション
- FormData を使用して、jQuery で配列として PHP に送る
- 必要なデータを隠しリストボックス( multiple ) に jQuery で追加して配列として PHP に送る
- Android Studio の追加日本語化用に、キャラクタセットに依存しないコード文字列を作成するツールを作成しました
- 画像ファイルが存在した時のみ、表示する jQuery の記述
- jQuery で mobile(スマホ) かどうかのチェックをしたくて調べたら、Stack Overflow の記事でいろんな方法が答えられていました。
- jQuery と FileReader オブジェクトによる、ローカルの複数画像ファイルのプレビュー表示
- とても面白くて簡単な jQuery のクリックしたコンテンツ以外を暗転(Blackout) するサンプル
- jQuery で、左右に並んだリストボックスの右側のデーターをダブルクリックしたら左へ転送してソートする処理
