![](/img/trans.png)
[英]Translating Prototype Ajax call into jQuery (adding form parameters and loading function)
[英]Change Prototype to jQuery Ajax call
我想將Ajax調用從Prototype更改為jQuery。 但是不知何故,事情還沒有開始。 .....幾個小時后,獲得了更清晰的圖像,一切正常。
為了讓其他人看到如何完成“遷移”,我仍然發布了此...
我的原始原型是這樣的:
<li>
<a href='#' onclick="variables(); Effect.toggle('datasets','BLIND'); return false;">
<div class='additionalLinksMenuBar'> </div>
<div class='tableName additionalLinksMenuLink'>define dataset</div>
</a>
</li>
<li>
<div id='datasets' style='display:none; border: 1px solid #00115a; background-color: #FFF6D1; text-align: left; margin-left: 8px; padding: 12px 10px;'>
<script type='text/javascript'>
function variables()
{
var url = 'http://my_url/etc/php/fill_variable_list.php';
var target = 'output-div';
var pars = 'selectedKeyword=cereals&selected_ids=&selectedDatasettype=1&p=';
var myAjax = new Ajax.Updater(target, url, {method: 'get', parameters: pars});
}
</script>
<br />
<div id='output-div'></div>
<script>
$('output-div').insert(new Element('form', { id:'form_define_dataset' }))
</script>
</div>
</li>
我的新jQuery是這樣的:
<li>
<a href='#' onclick="variables(); $('#datasets').slideToggle('slow'); return false;">
<div class='additionalLinksMenuBar'> </div>
<div class='tableName additionalLinksMenuLink'>define dataset</div>
</a>
</li>
<li>
<div id='datasets' style='display:none; border: 1px solid #00115a; background-color: #FFF6D1; text-align: left; margin-left: 8px; padding: 12px 10px;'>
<script type='text/javascript'>
function variables()
{
$.ajax({
type: 'GET',
url: 'http://my_url/etc/php/fill_variable_list.php',
data: 'selectedKeyword=cereals&selected_ids=&selectedDatasettype=1&p=',
dataType: 'html'
})
.done(function( html ) {
$( '#output-div' ).append( html );
});
}
</script>
<br />
<div id='output-div'></div>
</div>
</li>
#
代碼的轉換似乎是完全正確的。
嘗試以下代碼來查看您遇到的異常
$.ajax({
type: 'GET',
url: 'http://my_url/etc/php/fill_variable_list.php',
data: 'selectedKeyword=cereals&selected_ids=&selectedDatasettype=1&p=',
dataType: 'html'
})
.done(function( html ) {
$( '#output-div' ).append( html );
})
.fail(function( jqXHR, textStatus ) {
alert( "Request failed: " + textStatus );
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.