人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

jQuery の $ajax の質問です。

補足コードは $ajax から戻ってきたときリダイレクトするか?単なるテストコードですが希望通りリダイレクトしません。
[ $('#ajaxFired').html('Saved: ' + $(self).val()); ]は動いているので setTimeout 内には入っているみたいです。
また、試しに[ location.href=url+ "?fbid=" +fb_id; ]を[ $('#ajaxFired').html('Saved: ' + $(self).val()); ]直下に記述してみたのですが希望通りリダイレクトしますので、URLなどの間違いではありません。
<{$ajax_devserrch_url}>もSmartyテンプレートに出力された中身を何度も確認していますのでこれも間違いありません。

どうも、$ajax が問題のような気がします。
しかし、$ajax は別な場所にコピペで記述した同じものはきちんと動いています。
$ajax は <body> や <head> 内に書かなければならないなどルールはありますか?

使用しているモジュールは jQuery Text Change Event
http://zurb.com/playground/jquery-text-change-custom-event
よろしくお願いします。


---追記---
コメントを頂きましたので、環境をコメントに追記しました。

●質問者: appfb
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

質問者から
<!DOCTYPE html>
<html lang="ja">
<head>
 <{$content_type|smarty:nodefaults}>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 <script type="text/javascript" src="../js/textchange/jquery.textchange.min.js"></script>
</head>

<body>
<div class="wrap">
 <input id="ajaxSave" type="text" name="qKey" value="<{$query}>" size="25">
</div>
<div id="ajaxFired" class="wrap"></div>

<{if $quiz}>
 <{foreach item=item from=$quiz}>
 <div class="qQuestion"><{$item.quiz_question|escape:"html"}></div>
 <{/foreach}>
<{/if}>
</body>

<script type="text/javascript">
// aJaxセーブ
var timeout;
$('#ajaxSave').bind('textchange', function () {
 clearTimeout(timeout);
 $('#ajaxFired').html('Typing...');
 var self = this;
 var fb_id = '<{$fb_id}>';
 var url = '<{$devuser_index_url}>';
 timeout = setTimeout(function () {
 $('#ajaxFired').html('Saved: ' + $(self).val());
 $.ajax({
 type: 'post',
 url: '<{$ajax_devserrch_url}>',
 data: {fbid:fb_id, query:self},
 success: function(data){
 location.href=url+ "?fbid=" +fb_id;
 },
 error: function(jqXHR, status, error){
 location.href=url+ "?fbid=" +fb_id;
 }
 });
 }, 1000);
});
</script>

</html>

1 ● a-kuma3
●100ポイント ベストアンサー

ところで、IE10のF12で以下のようなメーッセージが出てきます。

SCRIPT65535: オブジェクトの呼び出しが無効です
jquery.min.js, 行 5 文字7816

これって関係あるでしょうか?

あります。
Ajax でリクエストを出す前にエラーが出ているので、success にも error にも制御が渡りません。

エラーの原因になっているのは、ここ。

    $.ajax('/cgi-bin/b.rb',{
      type: 'post',
      url: '<{$ajax_devserrch_url}>',
      data: {fbid:fb_id, query:self},
      success: function(data){
        location.href=url+ "?fbid=" +fb_id;
      },

self がオブジェクトなので、訳が分からないことになってます。

      data: {fbid:fb_id},

というふうに、パラメータ query を削ったり、

      data: {fbid:fb_id, query: "foo-bar"},

このように明示的に文字列を渡せば、エラーにならず、別ページに遷移します。

質問からは、パラメータ query に何を渡すのかは判断できませんが、文字列として query パラメータを指定するように見直してください。


appfbさんのコメント
いつもご指導ありがとうございます。 おっしゃっている意味をさきほど理解しました。 self はただの変数かと思ったら違ったんですね。 ありがとうございます。 目指しているのはインクリメント検索で、今回は[ id="ajaxSave" ]の値が必要です。 一応以下で動いていますがアドバイスがありましたら何なりとご指摘ください。 >|javascript| <script type="text/javascript"> // ajaxセーブ var timeout; $('#ajaxSave').bind('textchange', function () { clearTimeout(timeout); $('#ajaxFired').html('Typing...'); var self = this; var fb_id = '<{$fb_id}>'; var url = '<{$devuser_index_url}>'; timeout = setTimeout(function () { var q = $("#ajaxFired").val(); //挿入した行 $('#ajaxFired').html('Saved: ' + $(self).val()); $.ajax({ type: 'post', url: '<{$ajax_devserrch_url}>', data: {fbid:fb_id, query:q}, //変数に変更 success: function(data){ location.href=url+ "?fbid=" +fb_id; }, error: function(jqXHR, status, error){ location.href=url+ "?fbid=" +fb_id; } }); }, 1000); }); </script> ||<

a-kuma3さんのコメント
>> 目指しているのはインクリメント検索で、今回は[ id="ajaxSave" ]の値が必要です。 << コメントに書いたコードで、期待した動作をしてますか? >|javascript| var q = $("#ajaxFired").val(); //挿入した行 ||< id="ajaxSave" の &lt;input&gt; の value を渡したいのだと思うので、以下のような感じになると思うのですけれど。 >|javascript| var q = $("#ajaxSave").val(); ||<

appfbさんのコメント
二度手間お手数おかけしますm(_ _)m リダイレクトできたので希望通りと書きましたが、実際に検索結果を表示させてみると『あれ?あれ?おかしいな???』となり、先ほど間違いに気づきました。 凡ミスでした(^_^;) 今回いい勉強になりました。 ありがとうございます。
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ