iT邦幫忙

0

javascript function內參數 外部使用

請問因為在寫autocomplete 要呼叫jquery插件autocomplete 我想用javascript 呼叫一個function ,這個function會post資料給一個php程式檔, 然後接收這個php檔案回傳來的data 在這個function內處理 data的資料, 然後指派給變數。

最後在function印出這個資料 但是post function內指定的參數的資料 (傳值不傳址) 要怎麼用到外部可以繼續使用呢

var states = new Array();
	getlist();
	function getlist(){
		$.post('getparam.php', {
			'table': "customer",
	   },function(data){
	   	for(var i=0;i<data.length;i++)
	   	{
	   		states[i]= data[i].name;
            console.log("內部");
	   		console.log(states);   // <-這邊可以印出states

	   	}
		});

	}

	console.log("function後");
	console.log(states);    // <-這邊無法印出states
    
    $('#showMe').autocomplete({
	source:[states]

	}); 
1
tzuchin
iT邦新手 5 級 ‧ 2016-11-13 11:38:38
最佳解答

首先建議, getlist() 裡面那個for,可以在php處理好再拋出來

然後其實autocomplete可以這樣寫

$( "#showMe" ).autocomplete({
    source: function( request, response ) {
        $.ajax({
            url: "getparam.php",
            dataType: "string", // xml,json,jsonp... etc.
            method: "post",
            data: {
                table: "customer",
            },
            success: function( data ) {
                for(var i=0;i<data.length;i++)
                {
                    states[i]= data[i].name;
                    console.log("內部");
                    console.log(states);   // <-這邊可以印出states
                }
            }
        });
    },
    minLength: 2,
    select: function( event, ui ) {
        // do something
    }
});

或是你有特別原因堅持目前寫法,也可以試試看這樣寫,

var states = new Array();
	getlist();
	function getlist(){
		$.post('getparam.php', {
			'table': "customer",
		},function(data){
	   	for(var i=0;i<data.length;i++)
	   	{
	   		states[i]= data[i].name;
            console.log("內部");
	   		console.log(states);   // <-這邊可以印出states
	   	}
		}).done(function( data ) {
            $('#showMe').autocomplete({
                source:[states]
            }); 
        });
	}

	console.log("function後");
	console.log(states);    // <-這邊無法印出states
    

以下資料請google
1.在autocomplete本身就有接收遠端資料的寫法
2.無論是$post $ajax 都有 success 或 done 的參數可以用,請善用這個
3.如果上述2無法達到目的的話,那最後還有一個比較不好的 async 參數可以用

最後,抱歉,我把code寫好了,雖然不知道能不能正常run,但總覺得把你練習的機會剝奪了/images/emoticon/emoticon48.gif

抱歉 可能我問題描述的不是很清楚 ,
我是想要將post過後的取回來的資料,
data進行處理,
因為data取回來的資料,會是多筆的資料且每筆資料都有多個欄位跟值,所以在post取回來的function裡面,
會將data->指派給變數states,

//一開始選告
var states = new array();

function getlist(){
		$.post('getparam.php', {
			'table': "customer",
	   },function(data){
	   	for(var i=0;i<data.length;i++)
	   	{
	   		states[i]= data[i].name;   <-此值想在外部的資料中使用。
            //以下是目前想到的解決辦法 將states帶出來
            other_function(states);
	   	}
		});

	}
function   other_function(states){
  console.log(states);
}  


//非function內states會是空白
console.log(states);

    
    

但是post function內指定的參數的資料,無法在外部使用,會變成空的。

目前想到方法是 在裡面再多呼叫其他function 並傳變數給這個function。

fillano iT邦超人 1 級 ‧ 2016-11-15 09:55:45 檢舉

這個問題,第一位回答的大大已經說了。你在執行console.log(states)時,$.post()還沒跑完,所以沒東西。你想到的解法,就是一般常用的做法。

$.post()是非同步執行的,所以會先「返回」,然後等到執行完以後呼叫callback。所以後續處理要放在callback裡面,不是在呼叫$.post()之後。

1
Samと可樂快跑
iT邦研究生 2 級 ‧ 2016-11-13 10:20:22

因為jQuery的post是非同步的處理。
你最後的console.log()在php端回應資料前早就執行完畢了。
所以你就乖乖的寫一個function()專門用來處理資料回傳後的動作吧。
這種非同步或是執行緒的東西本來沒注意就很容易踩到執行順序的雷。

0
jsgao0
iT邦新手 5 級 ‧ 2016-11-15 13:30:25

callback是很難理解的,直接給你作法吧! 參考看看囉。


getlist(laterCallback); // 將欲在結束之後執行的程式包成的function laterCallback丟入getlist

function getlist(argLaterCallback) {
    $.post('getparam.php', {
        'table': "customer",
    },function(data) {
        var states = new Array();
        for(var i=0;i<data.length;i++) {
            states[i]= data[i].name;
            console.log("內部");
            console.log(states);   // <-這邊可以印出states
        }
        argLaterCallback(states); // 執行傳入的function
    });
}

// 欲在post完成後執行的程式寫在這個function
function laterCallback(states) {
    console.log("function後");
    console.log(states);
    
    $('#showMe').autocomplete({
        source:[states]
    }); 
}

我要發表回答

立即登入回答