仅在选择单选按钮时包含页面答案

【问题标题】：Include page only when radio button selected仅在选择单选按钮时包含页面
【发布时间】：2014-03-20 17:43:35
【问题描述】：

我对 Javascript 和 jquery 完全陌生，但我有一个页面和 3 个表单。表格位于外部文件中。我需要当我选择单选按钮 1 时，出现表格 1，单选按钮 2，表格 2 出现，等等。

谢谢。

汤姆。

【问题讨论】：

你试过什么？你遇到了什么问题？
我根本不知道该怎么做...
您可以包含所有表单并隐藏它们。仅在选择时显示。 .hide().show()
我不能这样做，因为表单在之前加载时会发生冲突。

标签： javascript jquery radio-button

【解决方案1】：

你可以像这样使用 ajax 来做到这一点：

HTML

<div id="ajax-form"></div>
<input class="radio-1" type="radio">

jQuery

$('.radio-1').on('click', function() {
    $.ajax({
        type: 'GET',
        url: 'form-1.html',
        complete: function(data) {
            $('#ajax-form').html(data);
        }
    });
});

$('.radio-2').on('click', function() {
    $.ajax({
        type: 'GET',
        url: 'form-2.html',
        complete: function(data) {
            $('#ajax-form').html(data);
        }
    });
});

...

【讨论】：

请原谅我的无知，我不知道如何实现这一点。只是
在中包含 jQuery，然后将其添加到标记的底部，然后将所有表单加载到不同的文件（form-1.html、form-2. html 等）在您网站的根目录中。

【解决方案2】：

我做了一个小 jsfiddle 演示，向您展示您通常如何处理这个问题。

var $button = $(".button"),
    $paragraph = $(".sometext");

$button.click(function (event) {
    // do something when ".a_button" is clicked.
    $paragraph.toggle();
    // there are many functions like .toggle
    // Take a look at .show and .hide, .slide, .animate and .fade
})

Here you go

【讨论】：