Javascript 淡入淡出以调用另一页

我正在尝试使用淡入淡出Jquery来显示另一个表单页面中的表单： 例如，当前页面显示一个表单，其中包含：姓名、年龄、国家/地区。我对“国家”输入使用自动补全。因此，如果一个用户找不到具有自动完成功能的国家，他应该在不更改页面的情况下添加它。所以我想调用另一个页面，该页面包含一个添加国家的表单，并使用fade_

我怎样才能做到这一点？谢谢

这是你的答案

代码

HTML

<div class="p1"><input type="text" placeholder="Name" /><br /><input type="text" placeholder="Address" /><br /><select id="country" ><option>Select a country</option><option value="india">India</option><option value="add">Add new country</option></select>
  <input  type="button" id="subc" value="Submit"/>
</div>

JQUERY

$(document).ready(function(e) {
    $('#country').change(function(e) {
        if($(this).val() == 'add'){
            $('.p1').fadeOut()
            $('.p2').fadeIn()
        }
    });
    $('#addc').click(function(e) {
        $c = $('#ncountry').val()
        if($c != ''){
        $('#country').append('<option>'+$c+'</option>')
        alert('Country added to list')
        $('.p2').fadeOut()
            $('.p1').fadeIn()
        }
        else{
            alert('Enter a country name')
        }
    });

$（文档）.ready（函数（e）{
$（“#国家”）。更改（功能（e）{
if（$（this）.val（）=='add'）{
$（'.p1'）.fadeOut（）
$（'.p2'）.fadeIn（）
}
});
$（'#addc'）。单击（函数（e）{
$c=$（'#ncontry'）.val（）
如果（$c！=''）{
$（“#国家”）。附加（“+$c+”）
警报（'国家/地区已添加到列表'）
$（'.p2'）.fadeOut（）
$（'.p1'）.fadeIn（）
}
否则{
警报（'输入国家名称'）
}
});

拨弄

---

希望它能帮助你：）

您需要使用ajax并阅读一些基本教程，无需调用其他页面。您可以保留一个隐藏的输入框，然后在用户找不到所需的国家名称时显示。@Ahmed:这在php中更容易，但在railsCheck my answer@user3242743thanks中则不容易！但是如何在同一窗口中显示淡入动画：（像这样）太棒了！你改变了什么？@user3242743接受我的答案，如果它对你有帮助：）

$(document).ready(function(e) {
    $('#country').change(function(e) {
        if($(this).val() == 'add'){
            $('.p1').fadeOut()
            $('.p2').fadeIn()
        }
    });
    $('#addc').click(function(e) {
        $c = $('#ncountry').val()
        if($c != ''){
        $('#country').append('<option>'+$c+'</option>')
        alert('Country added to list')
        $('.p2').fadeOut()
            $('.p1').fadeIn()
        }
        else{
            alert('Enter a country name')
        }
    });