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

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

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

Lodashは、JavaScriptのユーティリティライブラリ。Underscoreの派生ライブラリで、配列・オブジェクトの操作に便利です。また、コードの可読性も高めることができます。

JavaScript

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

jQuery

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

Q&A

解決済

1回答

385閲覧

jQueryで配列からテキストボックスに入力した値以下の部分を取り出す

toramo

総合スコア14

Lodash

Lodashは、JavaScriptのユーティリティライブラリ。Underscoreの派生ライブラリで、配列・オブジェクトの操作に便利です。また、コードの可読性も高めることができます。

JavaScript

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

jQuery

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

0グッド

0クリップ

投稿2018/05/07 13:45

実現したいこと

こんにちは。
サイト上にテキストボックスで2ケタの数字を入力できるようにし、
それをあらかじめリスト化してあるscriptから探して
入力した値以下のものに絞り込み全て取り出したいです。

前回質問させていただいた内容の続きになりますので
javascriptやhtmlの元データは前回同様こちらを参考にしています。
また、lodash.jsが必要になります。
(前回underscore.jsと書いてしまいました、すみません)

javascript

1var Lists= [ 2 { name: 'あいうえお', hobby: [['趣味1', '30', 'あああ'], ['趣味2', '20', 'いいい'], ['趣味3', '40', 'ううう']]}, 3 { name: 'かきくけこ', hobby: [['趣味1', '50', 'かかか'], ['趣味2', '30', 'ききき'], ['趣味3', '40', 'くくく'], ['趣味4', '40', 'けけけ']]} 4 { name: 'さしすせそ', hobby: [['趣味1', '20', 'さささ'], ['趣味2', '40', 'ししし']]} 5];

のような配列がある時に、

html

1<input type="number" class="hobby" name="hobby" value="180" min="1" max="180" step="1">日でマスターできる趣味

のようにしてあるサイト上のテキストボックスに例えば「25」と打ち込むと、
hobbyの欄の2番目に記述してある数字をそれぞれ比較して
25以下の趣味を持つ人に該当するあいうえおさんとさしすせそさんのみ取り出したいです。

同じくサイト上で名前をドロップダウン式で選択し絞り込むようにもしてあるのですが、それは

javascript

1function filterByName(value) { 2 return (value == "") ? _.constant(true) : function(item) { 3  var ranges = { 4 1: {name: "あいうえお"}, 5 2: {name: "かきくけこ"}, 6 3: {name: "さしすせそ"}, 7 }; 8 var range = ranges[value]; 9 return range.name== item.name; 10 } 11 }

で問題なく絞り込めるので、これを少し形を変えれば出来そうだと思ったのですが
私の実力では動かすことが出来ませんでした。
(上の関数は元サイトの絞り込み関数と少々違っていますが、前に別な場所で教えていただいた際にこのように記述を変えてもらったためそれを使っています)

試したこと

javascript

1function filterByHobby(values) { 2 return (values == "") ? _.constant(true) : function(item) { 3 var hob = [item.hobby[0][1]].concat(item.hobby[1][1],list.hobby[2][1],list.hobby[3][1]); 4 return _.some(hob, function(hobby){ 5 return hobby <= values ; 6 }); 7 }}

と書き換えてみましたが動きませんでした。
基本が分かっていない記述とは思いますが、なにとぞご容赦ください。

リスト内の趣味の欄の全ての2番目の数字を比較し、入力されたテキスト以下のものを取り出すには
どう書けばよいのか教えていただきたく思います。
よろしくお願いいたします。

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

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

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

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

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

guest

回答1

0

ベストアンサー

文字列型で比較してそうですね。
入力もリストの中の数字も parseInt() とかで数値型にして比較しましょう。

それと、わざわざ var hob = ... のようなことをしなくても _.some() の関数内で添字[1] つければ良いです。趣味の数が一定でないとエラー出ますしね。

javascript

1function filterByHobby(values) { 2 return values == '' 3 ? _.constant(true) 4 : function(item) { 5 return _.some(item.hobby, function(hobby) { 6 return parseInt(hobby[1], 10) <= parseInt(values, 10); 7 }); 8 }; 9}

投稿2018/05/07 15:24

yhg

総合スコア2161

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

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

toramo

2018/05/08 13:27

回答有難うございます!この式に変更したところ、無事に絞り込むことができました! someの時点で[1]は有効だったのですね。無知でお恥ずかしいです。 型など基本的な部分は自分で分かるようにもっと精進します。 今回は本当に助かりました。有難うございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問