2

次のコードがあります

$("#autocomplete").autocomplete({
    source: ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby"],
    close: function (event, ui) {
        alert($(this).val());
    }
});



<label for="autocomplete">Select a programming language:</label>
<input id="autocomplete">

取得した値を GET 関数として送信するにはどうすればよいですか? Ajax GET 関数を読みましたが、フォーム要素から取得したデータをエンコードする方法がわかりません

4

4 に答える 4

1

シリアライズを使用できます

フォーム要素のセットを送信用の文字列としてエンコードします。

http://api.jquery.com/serialize/

そして、これはあなたがそれを作ることができる方法です

<form id="myform">
    <label for="autocomplete">Select a programming language:</label>
    <input id="autocomplete" name="autocomplete">
    <input type="button" id="btnSubmit" value="send">
</form>

<script>
$(document).ready(function(){

    $("btnSubmit").click(function(){
         $.ajax({'url':'myurlforajaxrequest',
                 'data': $("#myform").serialize(),
                 'type':'get'
               });
    });

});
</script>
于 2013-04-12T05:23:59.087 に答える
0

jQuery $.ajax のデフォルトの contentType はapplication/x-www-form-urlencodedです。これは、jQuery がコンテンツをエンコードすることを意味します。ただし、別の contentType を指定しているため、データはエンコードされないため、独自のエンコードを行う必要があります。( Jquery ajax エンコーディング データ)

encodeURIComponentを試してください。( AJAX リクエストに対して jQuery で文字列を URL エンコードする)

特定の文字の各インスタンスを、文字の UTF-8 エンコーディングを表す 1、2、3、または 4 つのエスケープ シーケンスで置き換えることにより、Uniform Resource Identifier (URI) コンポーネントをエンコードします (2 つの「サロゲート」で構成される文字の場合、4 つのエスケープ シーケンスのみになります)。 "文字）。

例：

エンコードされた var = encodeURIComponent(str);

完全な解決策:

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>jQuery UI Autocomplete - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css"/>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css"/>
<script>
  $(document).ready(function() {
    $("#autocomplete").autocomplete({
    source: ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby"],
    close: function (event, ui) {
        $.ajax({
            url: 'yourAjaxRequestHandleFile.php',
            data: 'q=' + encodeURIComponent($('#autocomplete').val()),
            type: 'get',
            success: function (ajxResponse) {
                alert(ajxResponse);
            }
        });
    }
});
  });
  </script>
</head>
<body>
<label for="autocomplete">Select a programming language:</label>
<input id="autocomplete">
</body>
</html>

// ここに PHP コードがあります

<?php 
// Get Send Ajax Data
$q = $_GET['q'];
// Show Ajax Data and return to Ajax
echo "You submitted $q ";
?>
于 2013-04-12T06:36:05.820 に答える
0

これは$.getのドキュメントです。渡すデータは、JS オブジェクトまたは文字列のいずれかです。文字列は、基本的key=valにフォーム要素のエンコードされた表現です。このような文字列を取得するには、jquery フォーム要素でserializeメソッドを使用します。それが役立つことを願っています!

于 2013-04-12T05:23:04.837 に答える
0

送信先のスクリプトが何を期待しているかによって異なりますが$.get()、データに対して複数の形式を受け入れます。単純な文字列またはオブジェクトにすることができます。

たとえば、スクリプトprogramminglanguageがリクエストで変数を想定している場合、クローズ ハンドラは次のようになります。

$("#autocomplete").autocomplete({
    source: ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby"],
    close: function (event, ui) {
        var jqxhr = $.get("/my/script.php", "programminglanguage=" + $(this).val());
        // Alternatively:
        //var jqxhr = $(.get("/my/script.php", {"programminglanguage": $(this).val()});
    }
});

$.get()関数には、使用できる成功ハンドラー引数があり、jqxhr返されるオブジェクトのプロパティは、こちらjQuery.ajax()のページに記載されています。

于 2013-04-12T05:50:04.333 に答える