元スレ+ JavaScript の質問用スレッド vol.105 +

JavaScript覧 / PC版 /

みんなの評価 :

前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ

/ 要望・削除依頼は掲示板へ / 管理情報はtwitterで

651 = :

ｺﾞﾊﾞｰｸｗ

652 = :

>>648
>>1嫁お前はここでもスレ違い

654 = :

やっぱりSafariでは機能はあるがsubmitボタン押下時に検証しないようだ。invalidイベントが発火しない。
windows版のSafari5だからかな。iPhoneもダメだったが、macのSafari6はどう？
以下検証コード

<form><input required><input type="submit" value="送信"></form>
<script>
var fm = document.forms[0];
if ( typeof fm.checkValidity === "function" ) {
var inputRequired = fm.elements[0];
var testInvalidHandler = function(e) { alert("fired invalid event"); return false;};
inputRequired.addEventListener("invalid", testInvalidHandler);
var supported = fm.checkValidity() === false && inputRequired.validity.valid === false;
alert("HTML5 Forms validation is " + (supported ? "supported" : "not supported"));
//inputRequired.removeEventListener("invalid", testInvalidHandler);
}
else { /*IE-9*/
alert("HTML5 Forms validation is not supported");
}
</script>

Safariを含む対応ブラウザでは次の順でアラートが出る
1. "fired invalid event" ※checkValidity()の際に発火
2. "HTML5 Forms validation is supported"

656 = :

やわらかいなり

657 = :

>>654のような通常の機能テストでは使用可能と判断されるのに
いざ本来のタイミングでおこなわれるべき動作がおこなわれない。
どうテストすりゃえーねん。えーねーんん

658 = :

やわらかいなり

659 = :

エーネーン

661 = :

>>660
↓こういうこと？
function codeAddress(address) {
var latlng;
geocoder.geocode({'address': address},function(results, status) {
if (status == google.maps.GeocoderStatus.OK) { lating = results[0].geometry.location.toString(); }
else {alert(status);}
});
return latlng;
}

663 = 660 :

>>661
早々のレスありがとうございます。
ただ、その方法ではundefinedしか返らないんです。

664 = :

>>663
latingを宣言時にlatlngにしちゃってたので
それはたぶん俺の方のタイプミスのせいじゃないだろーか・・・

665 = :

逆だ。latlngをコールバック内でlatingにしちゃってた

666 = 660 :

>>665
いや、それとは関係なくundefinedなんです。

667 = :

それはすまんこ。あとは成功してるのか、どんなエラーが出てるのかですな

670 = 660 :

>>667
ソース自体エラーが出る訳じゃないんですが、latlngの値の取り方が分からないんです。

672 = :

>>654
Mac版Safari 6も同じような感じ。User-Agentで判断するしかないんじゃないかなあ。

673 = :

>>670
そのコールバック関数って非同期で呼ばれてるってことはない?

675 = :

>>672
Safari6も同じか～。試してもらってありがとうです。
AppleのサイトではSafari搭載の先進的機能としてフォーム検証機能もリストしてるんだが
実際どういう動作になってるのか・・・
ともかくUA判別は最後の砦として、簡易だが次のように考えてみた(インデントは全角空白)

<form><input name="name" required><input type="email" name="email" required><input type="submit" value="submit"></form>
<script>
var fm = document.forms[0];
var canUseHTML5FormsValidation = typeof fm.checkValidity === "function";
fm.addEventListener("submit",function(e){
　　console.log("fired submit event");
　　if ( canUseHTML5FormsValidation ) {
　　　　for ( var i=0,l=this.elements.length; i<l; i++ ) {
　　　　　　var element = this.elements[i];
　　　　　　if ( element.willValidate && !element.validity.valid ) {
　　　　　　　　console.log("[" + element.name + "] " + element.validationMessage);
　　　　　　}
　　　　}
　　} else { /* 従来どおりのJS検証 */ }
　　e.preventDefault();
});
</script>

対応ブラウザで不正な入力があればsubmitハンドラ実行前に中断されるので
ハンドラが呼ばれるときには必ず検証をパスしており、エレメントのvalidity.validがtrueになっている。
Safariではsubmitボタン押下で検証しないので不正な入力はfalseのままであり
メッセージがセットされた状態になっている。

676 = :

ぶっちゃけブラウザ経由しなくても送信できるんだから最終的にはサーバ側で処理しないと

677 = :

JavaScript無効の環境もあるかもしれないし、
あくまで「機能向上」の観点で行うのがいいと思うよ
その場でバリデーションの結果を反映させることができ、わざわざユーザーが送信しなくても
事前に間違いが分かる、という程度だと思ったほうがいい。
結局最終的なバリデーションはサーバーでやらなくちゃいけないんだし。
そう考えると、「ユーザーの利便性」にどの程度労力をかけられるかということにもなるな。

683 = 680 :

>>681
ajaxとかもそうだけど
非同期なことやる場合、その結果を受けて実行する関数を引数にとるでしょ
そういうのをコールバックって言ってみた

684 = :

あるいは、コールバック関数を登録するオブジェクトを返すようにして、
codeAddress 呼び出し後に登録。
codeAddressのfunction(results, status)ではそのオブジェクトに登録されているコールバック関数を呼び出す。

まあ、jQuery.Deferred のことなんだけどね。

686 = :

よろしくお願いします

【環境】Win7 Chrome, HTML5 form, UTF8
【何をしたのか】
ソースはチェックボックス等の選択で出力結果を得るフォーム
チェックボックスvalue に名称を格納していて & を含むもの有り
構文チェックでエラーが出たので '&' に書き換え
しかしJavaScriptの実行結果は '&' がそのまま出力

【期待する結果】'& の出力文字を & にしたい
【サンプルコード】
<input type="checkbox" name="chkItem" value="Book & Magazine">Book & Magazine
document.hoge.txtResult.value += document.hoge.chkItem[i].value;

687 = :

>>686
decodeURI
Sring.replace

688 = :

>>686
Google Chrome 26.0.1410.43 m で再現できない
http://jsfiddle.net/zaA6u/

689 = 680 :

>>688
Firefox19.0.2でも再現出来ない
というか、&と書いたらふつうにアンパサンドになっちゃいそうなもんだけど
http://jsfiddle.net/zaA6u/1/

690 = 680 :

失敗した失敗した失敗した失敗した

>>688
Firefox19.0.2でも再現出来ない
というか、&と書いたらふつうにアンパサンドになっちゃいそうなもんだけど
http://jsfiddle.net/zaA6u/1/

691 = :

>>687
どもです。decodeURI は効果なしだったけどreplaceで出来ました
&を含むURL生成もソース内でやっていて
不具合が出たので同様にreplace→encodeURI→window.openで対応出来

>>688-690
検証ども。自分もそちらはイケました
自分のソースでreplaceを咬ませる前の変数をdocument.writeしたら&でした
何が違うのか気になりますが…

693 = :

読み込んでエラーが出ないというのは構文エラーが含まれてないというだけ。
実行したときにエラーが出たら、その実行しているコードのどこかが悪い。
コードを調べてエラーを取り除く技術がないのなら、初歩に戻って勉強する。

それで、このidcheckは何をしてるのか説明してみなよ。

695 = :

ありません

697 = :

>>695

if (run == null) {
var run = setInterval(function(e) {

ここを見て何とも思わないのか？

698 = :

>>>697

おおっ
的確な答えありがとうございます。
トップレベルで宣言するようにしたらちゃんと思ったように動きました。