12566


JavaScript初心者です。

以下のようにprototypeを使って様々なページで使える汎用的なプラグインを作ってみたいのですが、どうしても`nextObj`が空になって帰ってきてしまいます。

試しにページネーションを使って（開発はCakePHPを使っています。）普通に出力をしてみた所、問題なく`?page=2`で次のページに遷移できましたのでデータはちゃんと入っているようです。

ご教授お願いいたします。

[code]

    /*
     * Ajaxで次のページを読み込むプラグイン
     * NexAj($trigger, $contentsToLoad)
     */
    function NextAj(el, obj) {
      this.initialize(el, obj);
    }
    
    NextAj.prototype.initialize = function(el, obj) {
      this.$el = el;
      this.$obj = obj;
      this.$obj.css({
        opacity: 0
      });
      this.counter = 2;
      this.handleEvents();
    }
    
    NextAj.prototype.handleEvents = function() {
      var self = this;
      this.$obj.imagesLoaded(function() {
        self.$obj.animate({
          opacity: 1
        });
      });
      this.$el.on('click', function(e) {
        self.loadNext(e);
        return false;
      });
    }
    
    NextAj.prototype.loadNext = function(e) {
      var $btn = $(e.currentTarget);
      $btn.html('loading....');
      $.ajax({
          url: '?page=' + this.counter,
          type: 'GET',
          dataType: 'html',
        })
        .done(function(data) {
          if (data = '') {
            $btn.html('no more list');
          } else {
            var nextObj = $(data);
            console.log(nextObj);
            $btn.html('Load More');
          }
        })
        .fail(function() {
          console.log("error");
        });
    }
    
    
    var loadRestaurantCat = new NextAj($('#load-more-list'), $('#listContainer'));
[/code]

[code]

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <ul id="listContainer">
      <li>hoge</li>
      <li>hoge</li>
      <li>hoge</li>
      <li>hoge</li>
    </ul>
    <a href="javascript:void(0)" id="load-more-list">
      Load More
    </a>
[/code]


CC BY-SA 3.0
2015-07-22T00:17:30.707
12555
2015-08-05T09:18:36.387
2015-08-05T09:18:36.387
8500
8500
question
javascript jquery ajax
prototypeを使って$.ajaxでの読み込み結果が空になってしまう。

[code]

    .done(function(data) {
      if (data = '') {
        $btn.html('no more list');
    
[/code]

if の中で `data = ''` と書かれていますが、この場合比較ではなく代入になってしまいます。

  * `data` に `''` が代入される
  * `''` を Boolean に変換すると `false` なので、 `if(false)` と同義

よって、 `$btn.html('no more list');` が実行されることはありませんし、`var nextObj = $(data);`
とする頃には `data` は `''` になっている、ということになります。

比較を行う場合、 `=` ではなく `==` （もしくは `===`）を使います。

参考 [等価演算子 - 演算子 - JavaScript入門](http://www.ajaxtower.jp/js/ope/index12.html)


CC BY-SA 3.0
2015-07-22T06:38:29.770
12566
2015-07-22T06:38:29.770
8000
12555
answer