Ajax html对div的响应

时间:2013-04-17 10:36:43

标签: ajax

您好我正在打印div元素的ajax html响应,并提供无线电输入选项来选择文件。选择特定文件后,另一个div应显示该消息。但是ajax html响应无法正常工作

Jquery脚本:

$(document).ready(function()
{  
    $('#upload').ajaxForm({
        beforeSubmit: function() {
            $('#Analysis').show();
            $('#Content_column').hide();
            $('#file_list').show();
            $('#trait').show();
            $('#trait').html('Submitting...');
        },
        success: function(data) {
            var $out = $('#file_list');
            $out.html('&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbspFile list:');
            $out.append('<div id="list">');
            $('#list').html(data); 
            $out.append('</div>');
        }
    });
});

此脚本的输出是

<ul class="php-file-tree"><li class="pft-directory"><a href="#">Genotypic</a><ul><input id="Penotypic" type="radio" name="uploads/Genotypic/" value="uploads/Genotypic/jquery.txt" />jquery.txt<br><input id="Penotypic" type="radio" name="uploads/Genotypic/" value="uploads/Genotypic/marker.csv" />marker.csv<br></ul></li><li class="pft-directory"><a href="#">Other</a></li><li class="pft-directory"><a href="#">Penotypic</a><ul><input id="Penotypic" type="radio" name="uploads/Penotypic/" value="uploads/Penotypic/namPheno.csv" />namPheno.csv<br><input id="Penotypic" type="radio" name="uploads/Penotypic/" value="uploads/Penotypic/perl.pl" />perl.pl<br></ul></li></ul>

Jquery脚本:

$('#Penotypic').click(function() {
   var $out1 = $('#trait');
   $('#trait').show();
   $out1.append('Submitted...');
});

这在div特征中没有显示任何内容。可能是html响应正在加载为tesxt,因此无法识别#Penotypic。请帮我解决这个问题。 Thanku

1 个答案:

答案 0 :(得分:1)

您有许多id="Penotypic"的输入。使每个id唯一或使用类作为函数触发器。

我不会在name属性中使用“/”。请参阅:http://www.w3.org/TR/html401/types.html#type-name

然后尝试你的ajax脚本是否有效。如果它不起作用,请尝试从 static 页面工作(不要使用您的第一个jQuery脚本,但它是作为静态表单输出)。您可能需要绑定事件触发器。使用jQuery的on()