ｊQuery 追加しようとするニュースタイトルと同じものが既にあったら追加しない 処理

Question

<button id="button"> ボタン </button>

<!-- 新着ニュース -->
<ul class="List NewsList">
　<li><span class="Time">10:43</span><a href="http://">aa</a></li>
　<li><span class="Time">10:39</span><a href="http://">aaa</a></li>
　<li><span class="Time">10:36</span><a href="http://">aaaa</a></li>

var $News = '<li><span class="Time"></span><a href="https://">a</a></li>';

　
$(function() {　　
	// 「id="button"」の要素がクリックされたら　
	$("#button").on("click", function() {　　
		//時刻取得　　
		var now = new Date();　　
		var h = now.getHours();　　
		var mi = now.getMinutes();　　
		var hh = ('0' + h).slice(-2);　　
		var mmi = ('0' + mi).slice(-2);　　　　　　
		var flag = false;　　　

		// ulリストの中身をすべて探索する　　
		$('ul.NewsList li a').each(function() {　　　　　
			if ($(this).html() === $News) {　　　　　　
				flag = true;　　　　　
			}

			if (flag === false) {　
				$(".NewsList").prepend($News);　
				$("ul.NewsList>li:first-child span.Time").text(hh + ':' + mmi);
			}
		});
	});
});

if文で追加しようとするニュースタイトルと同じものが既にあったら追加しない。という処理を教えていただけないでしょうか(:_;)！

Comments

[m.ts10806]

ソースコードも何もないですが、何に対して何が問題なんでしょうか。この質問内容だけだと意味が分かりません。

[m.ts10806]

インデントが全くないようなのでコードが読みづらく、また閉じ忘れなどもおきやすい状態となっています。コードフォーマッターなど利用してコードを調整してください。

[m.ts10806]

どうぞ。　http://tools.m-bsys.com/development_tooles/jsbeautifier.php そもそも閉じ忘れがあってエラーとなりますね。提示のコード。

[rrrrrrr]

すみません～～～(:_;)

[m.ts10806]

$Newsの変数に入れるところ;がない。$(function() {　の閉じ});がない。　まずはここを直してコードフォーマットしなおしてください。正しく閉じられていないため、コードフォーマットも正しく行われていません。

Answer 1

• タイトルと同じもの
• 既にあったら
• 追加しない

上記３点の定義をしてもらえばできそうな気はします

sample

一応こんな感じ
ローカル時間を表示してどうするの？という気はします
サーバーからajaxで時間とタイトルを受け取るよう設計したほうがいいかと

var news='<li><span class="Time"></span><a href="https://">a</a></li>'
$(function(){
  $("#button").on("click",function(){
    if($('.NewsList a').filter(function(){
      return $(this).text()==$(news).find('a').text();
    }).length==0){
      var now=new Date();
      var hhmm=("0"+now.getHours().toString()).substr(-2)+":"+("0"+now.getMinutes().toString()).substr(-2);
      $('.NewsList').prepend($(news).find('span.Time').html(hhmm).end());
    }
  });
});

<button id="button"> ボタン </button>

<!-- 新着ニュース -->
<ul class="List NewsList">
<li><span class="Time">10:43</span><a href="http://">aa</a></li>
<li><span class="Time">10:39</span><a href="http://">aaa</a></li>
<li><span class="Time">10:36</span><a href="http://">aaaa</a></li>
</ul>

Comments

[rrrrrrr]

自分プログラミング始めたばっかりで、練習問題として
・ボタンを押下したら「新着ニュース」が1つ増えるように
・時間はボタン押下時の時分
というのをやってまして、
prependで要素を追加しているためボタンを押すたびにどんどん同じのが追加されちゃうんで
・追加しようとするニュースのタイトルと同じものが既にあったら追加をやめる
というのをやっているのですが、なかなかうまくいかないのです・・・(:_;)

[yambejp]

sampleでつけたソースでできませんか？

[rrrrrrr]

できました(:_;)
どこでどのような処理をしているのか詳しく教えていただけたら嬉しいです(:_;)！

[yambejp]

まず追加する新しいニュースは
var news='<li><span class="Time"></span><a href="https://">a</a></li>'

そのタイトルは$(news).find('a').text()になり、
それとtextが合致する.NewsListの中のaタグの数（length）が0
すなわち一つも合致しなければ
$('.NewsList')に$(news)をprependしています。
その際$(news)のspan.Timeを現在時に書き換えています

[rrrrrrr]

なるほど・・・！
助かりました(:_;)
詳しく書いていただきありがとうございました；；

[rrrrrrr]

yambejpさん
私が定義した時刻習得のやり方だとどのようなコードになるでしょうか・・・(:_;)

[yambejp]

> 私が定義した時刻習得のやり方

ほぼおなじロジックで時刻は拾っていますけどなにか違いますか？

[rrrrrrr]

問題を出していただいた方に
時間はこれで大丈夫と言われたのでこれを使ってできるコードもあるのかなーと思い聞きました(:_;)