2ちゃんねる スマホ用 ■掲示板に戻る■ 全部 1- 最新50    

■ このスレッドは過去ログ倉庫に格納されています

JavaScript ライブラリ総合質問所 vol.4

1 :Name_Not_Found:2014/05/23(金) 17:35:17.23 ID:???.net
JavaScriptライブラリ を自ら学ぶ人のための質問スレッドです。

■質問を書く上で
(1) 質問にならない投稿はご遠慮ください。(煽り、コード制作依頼など)
(2) 他の人に迷惑をかけるスクリプトの質問はご遠慮ください。
  (ブラクラ、[戻る], [閉じる], [クリック] の妨害、画面占有など)
(3) 長い間連続して質問する場合にレス番を名前にしてあれば、質問の流れが回答者に伝わりやすくなります。
(4) 常に自発的に調べる心構えを持ってください。
  具体的には「自分で調べてから質問する」「回答をもらってわからない単語があればGoogle検索してみる」など。
  わからない内容を代わりに調べてくれる回答者をお望みの方は余所で質問してください。
(5) 出来るだけ一般的な用語を使用してください。脳内オレオレ用語は混乱の元です。
(6) 出来るだけサンプルコードを掲示してください。言葉による説明は行き違いが生まれる場合があります。
  ※必ず「問題の事象が再現されること」を確認してください。
   必要な部分だけ切り出したつもりで現象が再現できていなかったケアレスミスがしばしば見られます。
(7) サンプルコードに HTML が含まれる場合は http://validator.w3.org/ で [Check] してみてください。
(8) 質問を具体的かつ詳細に書くと回答を得られやすいです。質問テンプレートを活用してみてください。

■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。(ex: IE8, Firefox4)
【ライブラリ】使用しているライブラリ名を記入してください。(ex: jQuery)
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。(Windows なら「コピット」を活用)
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
 1レスに収まらないならコード投稿サイトを利用してください。
 http://jsdo.it/ http://jsbin.com/ http://jsfiddle.net/ http://ideone.com/

936 :Name_Not_Found:2015/03/27(金) 14:50:15.19 ID:???.net
>>931
HTML(属性含む)は初期値だと思え。

attrメソッドで意図的に属性を変えない限り、
変わるのは内部の値だけだ。

937 :Name_Not_Found:2015/03/27(金) 21:40:48.55 ID:???.net
>>931
要望・バグとして中の人に報告してみれば?
そもそも data-* 属性を読んでいるにもかかわらず、>>932 が指摘しているような dataset のプロパティ set 時に起こるべき本来の副作用(属性作成や属性値変更)を伴わない。
これは明らかに手抜き実装によるバグだな。
なぜなら、jQuery の中の人にとって古めかしいと言われている IE8 ですら getter, setter はサポートされているので、簡単に polyfill 可能だから。

938 :Name_Not_Found:2015/03/27(金) 21:52:28.42 ID:???.net
>>937
> これは明らかに手抜き実装によるバグだな。

何いってんの? DOMでも一緒だよ。

何でもかんでもjQueryの問題にするな。

939 :Name_Not_Found:2015/03/27(金) 22:45:32.01 ID:???.net
>>937
>>936にも書いてあるけどHTML(属性含む)は初期値を示す
バグではなくドキュメントにも明記してあるから想像で書き込まずにまず確認しよう
http://api.jquery.com/data/#data-html5
> The data- attributes are pulled in the first time the data property is accessed and then are no longer accessed or mutated

ちなみにjQuery 1.4.2以前では、HTMLのdata-***属性は jQueryの.data()の初期値ですらなかった
data-***属性が初期値であるのはおまけ程度に考えたほうがいいだろう

940 :Name_Not_Found:2015/03/28(土) 02:47:33.51 ID:???.net
data-* 属性は文字列でなくてはいけない
.data()でセットできるのはオブジェクト
これを考えてみると、.data()にセットしたものをdata-*属性に反映させるというのが
無茶というのがわかるでしょう

ちなみに、data-*属性にJSON形式でセットしておくと、
.data() で取り出した時にはデコードされている
これを可逆にするんなら、.data()でセットできるオブジェクトは
JSON形式にできるものだけになっちゃう
これも今更無理

941 :Name_Not_Found:2015/03/28(土) 04:35:47.15 ID:???.net
文字列でなければならないのではなく、HTMLの属性値なので取得時にJSの文字列になりますよということ。与える時には数値でも何でもよくて、それをJSでsetAttribute() すれば文字列表現に変換される。

無茶でも何でもない。JSのオブジェクトリテラルをそのままセットすれば良いだけ。

942 :Name_Not_Found:2015/03/28(土) 04:44:27.29 ID:???.net
何故JSON?
その略語を展開すれば解ると思うが、そもそもそれはJSのオブジェクトリテラルに制限を付けたサブセットだ。
だから、JSのオブジェクトリテラルそのままを書けば良いだけ。
もっと古きを言えば、そもそもオブジェクトリテラル自体は読み取り時の表現形式だったが、17年前くらいにJSコードで書けるようになった。JSのデータ表現文字列としてはそれ以前の本当に初期から存在するのに知らないとかどうかしてるだろ君は草

943 :Name_Not_Found:2015/03/28(土) 04:55:08.85 ID:???.net
ていうか、IE4からIEには18年もexpandoプロパティというものがあってだな、data-* なんてのはそれをパクった上に属性名(JS用語だとプロパティ名)を別物にしてIE非対応としてIEを貶めるための嫌らしい政治的戦略なわけだ。
とりあえずそのexpandoには何でもセット出来た。

もっと言えばだな、IE5.5には#default#userDataというものがあってだな、その中でmsxmlやり放題だったわけ。その超絶有用な発展的独自仕様を捨てるそうだが、糞なHTML5にダウングレードするのは楽だがアホらしい作業だろうなと同情するわ。

944 :Name_Not_Found:2015/03/28(土) 05:08:45.62 ID:???.net
まあとりあえずそのjQueryの実装は手抜きだな。
飽きてんだろうな、ソース読んでもテキトーにやってます感が漂っている感じがする。
jQuery終わっとるな。

たぶん、backbonejs未満のヘルパーライブラリーに集約されるんだろうな。
要らん工夫は要らんと。

たとえば、今更のprototypejsをprototypeじゃなくてオブジェクト(いわゆるクラス)のメソッドとして定義する。
使う時はcall/apply強制ということ。
たとえば今のArray.map(ArrayLike, ...thisObj)みたいな使い方。
しかしこれは現在猛烈に普及中のアロー関数で面倒くさいことになる。
なかなかうまくいかないねえ。

945 :Name_Not_Found:2015/03/28(土) 05:35:04.60 ID:???.net
ソース読むだけでテキトーかどうかわかるのか。凄いなあ
俺もその能力が欲しい

946 :Name_Not_Found:2015/03/28(土) 08:02:32.37 ID:???.net
JSON形式にしてセットする仕様だとして

var a = {};
a.foo = a;
$('div').data('bar', a);

としたらどうなるか考えて見ればいい

947 :Name_Not_Found:2015/03/28(土) 09:21:56.80 ID:???.net
>>942
data-*属性に格納する例だからJSONなのでは?

948 :Name_Not_Found:2015/03/28(土) 11:58:13.92 ID:IZc5QMVF.net
HTML5でフォームの各inputにrequired属性を指定しています。
PC版のChrome等ではフォームを実行しようとするとエラーを出して実行されませんが、
スマホからだと素通りしてフォームが実行されてしまいます。
そこで、JavaScriptでValidationのチェックをしようと思うのですが、
HTML5のpatternやrequiredなどからエラーを出してくれる(HTML側の設定を使い、JavaScriptでValidationの設定をしなくて良い)ライブラリはないでしょうか?

949 :Name_Not_Found:2015/03/28(土) 12:03:41.45 ID:???.net
>>944
> まあとりあえずそのjQueryの実装は手抜きだな。

違うよ。よりよい実装だよ。

例えば、element.onclickに代入しても、
要素のonclick属性は作られない。
それと一緒だよ。

950 :Name_Not_Found:2015/03/28(土) 12:10:13.93 ID:???.net
>>947
じゃあこれだとどうなると思う?

var a = {}
a.foo = function() {};
a.bar = new Bar();
$('div').data('bar', a);

要素に紐付けたいデータというのは
文字列に出来るものだけじゃなくて、
オブジェクトも有りえるんだよ。

datasetで出来るのは文字列で表せるものだけ。
だから限界があるんだよね。

951 :Name_Not_Found:2015/03/28(土) 12:22:51.72 ID:???.net
>>950
勿論、無理だよ
そんな制限はわかった上での発言だと見たけどね

952 :Name_Not_Found:2015/03/28(土) 12:35:34.39 ID:???.net
そもそも、>>940は「data-* 属性は文字列でなくてはいけない」 といっているのだから何も間違ってない
最も、.>>950は「data() ではオブジェクトリテラルを使える」と反論しているようにも見えるけどね
だとしたらまるで噛み合ってないね

953 :Name_Not_Found:2015/03/28(土) 12:52:54.58 ID:???.net
>>943
> ていうか、IE4からIEには18年もexpandoプロパティというものがあってだな
expandoプロパティはJavaScript、data-*属性はHTMLなわけで役割がまるで違う
ただのデータ格納庫としか見ないからそんな変な発想になる

> もっと言えばだな、IE5.5には#default#userDataというものがあってだな
過去に Node#setUserdata を標準化する動きがあったが、廃止された
代替機能は ES6 の WeakMap あたりが妥当かね
何でもかんでも標準化すればいいってわけじゃない

954 :Name_Not_Found:2015/03/31(火) 19:55:00.12 ID:xPIMV4ox.net
要素が画面に入ってからアニメーションをしたいのですが、
要素が画面に入った時の判定?がわかりません
どうすればいいですか?

955 :Name_Not_Found:2015/03/31(火) 20:22:12.37 ID:xPIMV4ox.net
解決しました

956 :Name_Not_Found:2015/04/03(金) 22:05:51.80 ID:???.net
別ドメインの.jsファイルをWebStorageにキャッシュするという
単機能のライブラリを以前どこかで見たのですが
名前を控えておらず検索してもちっとも引っ掛かりません
それっぽいものか同等のものがあれば教えて下さい

957 :Name_Not_Found:2015/04/13(月) 17:14:14.09 ID:???.net
+ JavaScript の質問用スレから誘導されました。

DW5.5を使っています。トップページにスライドショーを設置したく、

http://makasete-web.net/bxslider

上記を参考に書いてある通りやってみたのですが、上手く表示されません。
スライドには3枚の画像を使っているのですが、
DWのライブビューには縦に3枚表示されている状態です。
ブラウザ(サファリ)でも同じように縦に3枚表示されています。

ソースコードはコピペで貼付けているため、ミスは考え辛いのですが、
何か根本的に間違っている箇所があるのでしょうか?

まず上記サイトからダウンロードしたファイルのうち、
imagesの中にある画像2枚を既に当方のサイトで作成済みだったimages(ローカル)フォルダの中へ。

jquery.bxslider.cssをcss(ローカル)フォルダの中へ。
jquery.bxslider.min.jsをindex.htmlと同じ階層へ。
ちなみにimages、css両フォルダはindex.htmlと同じ階層にあります。

長過ぎと言われたので一旦切ります。

958 :Name_Not_Found:2015/04/13(月) 17:15:32.65 ID:???.net
>>957続きです

記述内容は、head内に

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="js/jquery.bxslider.min.js"></script>
<link href="css/jquery.bxslider.css" rel="stylesheet" />


<script type="text/javascript">
$(document).ready(function(){
$('.bxslider').bxSlider({
auto: true,
});
});
</script>


body内に


<ul class="bxslider">
<li><img src="images/top_1.jpg" title="画像1" /></li>
<li><img src="images/top_2.jpg" title="画像2" /></li>
<li><img src="images/top_3.jpg" title="画像3" /></li>
</ul>


としていますが、上記の通りライブビューでもブラウザ(サファリ)でも指定した画像が縦に3枚表示されるのみで、
スライドショーにはなっていない状況です。
どなたかアドバイスをお願い致します。

959 :Name_Not_Found:2015/04/19(日) 14:42:58.22 ID:???.net
cssが効いてないんじゃない 知らんけど

960 :Name_Not_Found:2015/04/25(土) 07:57:32.28 ID:???.net
http://iand2ch.net/test/read.cgi/hp/1429873274/10 への回答。
githubにサポートブラウザが載ってるよ。

> Browser Compatibility
> PEP should work on IE 10+ and the latest versions of Chrome, Safari, Firefox, and Opera.
https://github.com/jquery/pep#readme

961 :Name_Not_Found:2015/05/11(月) 07:54:04.69 ID:???.net
只今個人でウェブサイトを作っていて複数の画像を回転させようとしているのですが
ひとつづつに動作を記述すのがめんどいので同じ所は関数を作ってまとめようと思い
自分なりに考えてやってみたのですがうまくいきません汗
よかったらどうすればいいのか教えてください
一応個別で一つづつ書いた場合は回転しました。
サンプル
html---------------------
<html>
<head>
<script src="jQueryRotate.js" type="text/javascript"></script>
<script src="rolling.js" type="text/javascript"></script>
</head>
<body>
<img id="imge001">
<img id="imge002">
</body>
</html>
rolling.js-----------------------
$(function(){
function rollin(nam1,nam2){
$(function(){
var angle = 0;
setInterval(function(){
angle+= nam1;
$("nam2").rotate(angle);
},10);//
rollin(5,image001);
rollin(2,image002);
});

962 :Name_Not_Found:2015/05/11(月) 08:39:43.26 ID:???.net
>>961
> $("nam2").rotate(angle);
nam2要素が存在しないので動く訳ないと思うんだけどなあ
HTMLのid属性値もtypoしてるし、張り付けるコードは動くことを確認してないよね?

あと、配布サイトのURLを貼ってくれないかな
http://uzmk.jp/blog/tips/entry-229.html
上記URLだとして、 $("#imge001, #imge002").rotate(angle); で期待通りに動作すると思われる
他にもtypoありそうだし、検証はしてないけど方法としてはいけると思う
まあ、俺なら全てに同じクラスを付けてセレクタの手間を省くけど

963 :Name_Not_Found:2015/05/11(月) 09:22:23.20 ID:???.net
>>962
ありがとうございます

nam1,nam2は、function rollin(nam1,nam2)で定義したと思ってました汗
別で定義しないといけないのですか?

参考urlはそこであってます
御手数御掛けして申し訳ありません

あと今回は回転自体は複数でさせようと思うのですが
速度や向きは変えたいのでその数値だけ引数で指定したいと思っています汗

何分初心者なのでもっと勉強させてください

964 :Name_Not_Found:2015/05/11(月) 13:30:02.71 ID:???.net
ダブルクォートで囲んじゃったら変数じゃないでしょ

965 :Name_Not_Found:2015/05/11(月) 14:33:58.19 ID:???.net
セレクターのグルーピングはCSSを書く段階ですらレガシーバグ対策の為に回避する類の物なので、jQueryがわざわざそこを実装してやる必要性が皆無だ。
こういう所からしても設計思想が欠如しているとしか言いようがない。
言うまでもなくjQueryはJSそのものなのでCSSのような設定ファイルではない。設定ファイルで便利だったグルーピングは処理手順ファイルでは不透明でバグの温床にしかならない。

966 :Name_Not_Found:2015/05/11(月) 20:29:59.60 ID:???.net
>>965
とりあえずお前が何も読んでないで意味不明な
ことを言ってるだけの馬鹿だってことは分かったよ

967 :Name_Not_Found:2015/05/25(月) 18:47:08.41 ID:???.net
openlayers3について質問させてください

http://openlayers.org/en/v3.5.0/examples/kml-timezones.htmlをそのままコピーして
ローカルで実行したのですが,サンプルのようにTimezonesが表示されません(地図は表示されます)
kmlファイルはhttps://github.com/openlayers/ol3にあるdataフォルダをhtmlと同じ階層に設置しました
他のkmlファイルを読み込むサンプルも同様に動かないのですが何が原因でしょうか

968 :Name_Not_Found:2015/05/29(金) 19:29:22.48 ID:???.net
>>967
マルチポストしてる
下記スレに移動したようなのでこの質問はクローズかな
http://peace.2ch.net/test/read.cgi/tech/1417749547/131-

969 :Name_Not_Found:2015/05/29(金) 22:11:51.07 ID:???.net
考えたらマルチポストなんて簡単に規制出来るのに、2chの運営って意味わからん。

970 :Name_Not_Found:2015/07/02(木) 02:57:19.56 ID:???.net
横並びの要素の高さを揃えるライブラリって何使っている?
fixHeightを使ってたんだけどjQueryのバージョン上げたら使えなくなった

971 :Name_Not_Found:2015/07/02(木) 06:12:14.60 ID:???.net
display: table

972 :Name_Not_Found:2015/07/02(木) 13:16:36.93 ID:???.net
複数段の場合にもdisplay: table使っているの?

973 :Name_Not_Found:2015/07/02(木) 16:51:33.58 ID:???.net
横からだけど…。
モダンブラウザなら display: box
IE8 を考慮するなら上記に加えて display: table
IE7 を考慮するなら上記に加えて JavaScript(簡単だからライブラリを使うまでもなく自作する)

974 :Name_Not_Found:2015/07/02(木) 23:00:47.22 ID:???.net
tableタグ使ったほうが早いw

975 :Name_Not_Found:2015/07/19(日) 19:43:23.81 ID:???.net
https://gist.github.com/anonymous/1944f34703bcb63131d8

このトピでトピ主に反論している、anonymous10000の言っている事がいまいちよくわからんのだが、
誰かわかる人居る?

976 :Name_Not_Found:2015/07/20(月) 03:31:48.52 ID:???.net
トピマス殿!
gistはこんな使い方もできるんだねえw

977 :age:2015/08/09(日) 22:45:14.87 ID:???.net
age

978 :Name_Not_Found:2015/08/20(木) 23:06:26.74 ID:???.net
こんにちは
Auth0でログインを実装しようと思っています。

Auth0の認証に使うオブジェクトの生成時、コンストラクタにクライアントIDとドメインを渡すんですが、
これをjsコード上にそのまま書くのはマズイですかね?

979 :Name_Not_Found:2015/11/07(土) 17:20:23.60 ID:vT73by48.net
( ´_ゝ`)

980 :Name_Not_Found:2015/11/07(土) 21:11:56.88 ID:???.net
javascriptで表の表示をしたいのですが
何かいいプラグインやライブラリなどないでしょうか?

※別スレから誘導されてきました。
 あちらではご指導頂きましてありがとうございます。

981 :Name_Not_Found:2015/11/07(土) 22:29:01.89 ID:???.net
ただ表作りたいだけなら適当にTable要素作るだけでいいんでね
機能性が欲しいならParamQueryとか

982 :Name_Not_Found:2015/11/08(日) 13:11:38.65 ID:???.net
CreateJSって
FlashでActionscript3.0で書いたコンテンツを書き出して
ブラウザで再生できるようになるの?

983 :Name_Not_Found:2015/11/30(月) 04:52:35.07 ID:???.net
e

984 :Name_Not_Found:2015/11/30(月) 04:53:42.36 ID:???.net


985 :Name_Not_Found:2015/11/30(月) 04:56:13.57 ID:???.net


総レス数 985
304 KB
掲示板に戻る 全部 前100 次100 最新50
read.cgi ver 2014.07.20.01.SC 2014/07/20 D ★