0

テキストボックスと送信ボタンがあります。フォームが送信されたとき（Enterキーを押すか、ボタンをクリックしたとき）、ブラウザを現在のページに残し、何もリロードしないようにします。

テキストフィールドから入力を取得し、このデータを使用してHTTP GET APIに接続し、APIからの出力を入力テキストボックスに戻し、出力を強調表示してクリップボードにコピーできるようにします。

私はjQueryを初めて使用するので、誰かがこのうまくいけば小さなコードのスニペットを書いてくれるなら、それは大いにありがたいです:)

4

3 に答える 3

1

これはうまくいくはずです。クロスドメインを ajax することはできません。

$(function(){
    $('#idOfForm').on('submit', function(e){
        e = e || window.event;
        e.preventDefault();
        $.ajax({
            url: 'curl.php',
            data: $(this).serialize(),
            datatype: 'post',
            success: function(data){
                //do something with returned data
                alert(data);
            }
        });
    });
});

curl.php:

$url = 'http://apiurl.com'; 
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch ,CURLOPT_POST, 1); 
curl_setopt($ch, CURLOPT_POSTFIELDS, $_POST); 
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, FALSE);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, 2);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
$contents = curl_exec($ch);
$err = curl_getinfo($ch, CURLINFO_HTTP_CODE);
curl_close($ch);
echo $contents ? $contents : $err;
于 2012-05-26T00:56:53.713 に答える
1 
$('#your_button_id').click(function(e){
  e.preventDefault(); //to stay on same page
  $.ajax({
    type: 'POST',
    url: 'your_url',
    data: $('#form_id').serialize(),
    success: function(response){
        //On success you will have responce from server
        //Do all yo need with buttons and texts
    }
  });
});
于 2012-05-26T00:59:48.330 に答える
1

このコードは次のように述べています。

  • フォームが送信されると...
  • デフォルトのこと（フォームの送信）をしないでください...
  • 特定の値で指定されたサーバーにGETリクエストを送信し、それが完了すると...
  • データを入力に入れ、...
  • 入力内のテキストを選択します。

URL を、mystringサーバーがパラメータとして期待するものに変更する必要があります。複数のフォームまたは入力がある場合は、ID またはクラス (form#myidまたは などform.myclass) を指定する必要があります。それ以外はこれでうまくいくはずです。

$('form').submit(function(e){
    e.preventDefault();
    $.get("/url/from/get/api", {mystring: $('input').val()}, function(data, status) {
        $('input').val(data);
        $('input').select()
    });
    return false;
})

詳細については、http://api.jquery.com/jQuery.get/を参照してください。

于 2012-05-26T01:00:59.657 に答える