質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

2回答

1393閲覧

this 相当品の作り方

Marbow

総合スコア55

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2017/08/27 06:21

$("div[data-uihid]").addClass("clickable").click(function(e){ uiHistory( this ); });

のように、要素に対してクリックイベントを設定して呼び出す関数があります。
基本的に、クリックされたのは誰だっけ?ということで this を使っているのですが、ページ更新時に[data-uihid]が特定の値を持つ要素をクリックしたように見せたいケースが出てきました。
同じソースの別な場所から uiHistory() を呼ぶ形になるのですが、その際、uiHistory に何を渡してあげれば this 相当になるのでしょうか?
あるいは、そもそも無理なのでしょうか?

dom = $("div[data-uihid='"+param+"']"); // paramは特定したいid

で場所の特定はできてそうな気はします。

[data-uihid]はユニークで重複はありません。

なんとなく、できそうな気はするのですが、ネットの検索の仕方がよくないのか、なかなかコレといった答えに行き当たりません。
識者の方々、よろしくお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

ベストアンサー

いまいち要件がわかりませんが、eachでできると思います。

JavaScript

1$("div[data-uihid]").each(function(e){ 2 uiHistory( this ); 3});

【jQuery入門講座 使い方-thisについて(2)】
http://www.jquerystudy.info/tutorial/basic/this2.html

【【jQuery】間違えやすい「$(this)」と「this」の使い方とは? - ONZE】
http://on-ze.com/archives/1816


JavaScript

1// 単純にこうでも良いです。 2uiHistory( $("div[data-uihid]").get(0) );

【.get() | jQuery 1.9 日本語リファレンス | js STUDIO】
http://js.studio-kingdom.com/jquery/core/get

投稿2017/08/27 06:27

編集2017/08/27 06:31
kei344

総合スコア69364

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Marbow

2017/08/27 06:30

すみません、質問のしかたがよくなかったようです。 最初のコードのようにして定義した uiHistory() を別な場所から呼びたいのですが、その時に、定義している時の this 相当品はどうやって作ればよいのでしょうか? ということです。
kei344

2017/08/27 06:36 編集

jQuery の this はターゲットになっている DOM要素なのでそれを渡せばよいですよ。
Marbow

2017/08/27 06:54

リンク先読んで this が何者か少しわかった気がします。 そして、頂いたコードでいくら頑張ってもundefinedになるのはなぜじゃー、と悩んでいたのですが、 何のことはない、当該要素をajaxで作っていたので準備が間に合っていなかっただけでした。 結局、.get(0)が一番簡単な策でした。 知らないって、恐ろしい。 そして、瞬殺で回答いただきありがとうございました。
guest

0

的外れかもしれませんが、以下のような動作でしょうか?

HTML

1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="UTF-8"> 5 <title>タイトル</title> 6 <style type="text/css"> 7 * { 8 margin: 0; 9 padding: 0; 10 } 11 12 div[data-uihid] { 13 width: 200px; 14 height: 200px; 15 background-color: #a9ff3a; 16 margin-bottom: 1px; 17 } 18 19 .clickable { 20 background-color: #ff58b9; 21 } 22 </style> 23</head> 24<body> 25<div data-uihid="foo"></div> 26<div data-uihid="bar"></div> 27<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 28<script> 29 var param = "foo", 30 dom = $("div[data-uihid='" + param + "']"); // paramは特定したいid 31 32 function uiHistory(arg) { 33 console.log(arg); 34 } 35 36 $(function () { 37 uiHistory(dom); 38 }); 39 40 $("div[data-uihid]").addClass("clickable").click(function (e) { 41 uiHistory(this); 42 }); 43</script> 44</body> 45</html>

投稿2017/08/27 06:33

s8_chu

総合スコア14731

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Marbow

2017/08/27 06:56

やりたいことはそうなんですが、そこでdomをどうやってthis相当にするのかで悩んでました。 結果、.get(0)で片付いたという…。 お騒がせしました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問