是否可以在单击单选按钮时刷新 div？

Posted 2023-03-05

【中文标题】是否可以在单击单选按钮时刷新 div？

【英文标题】：Is it possible to refresh a div on a radio button click?

【发布时间】：2015-10-01 06:29:12

【问题描述】：

是否可以通过单击该 div 中显示的单选按钮来刷新该 div？

我有这种情况；

使用 jQuery，我需要在单击单选按钮时刷新 div。单选按钮存在于我需要刷新的特定 div 中。

到目前为止我所做的所有研究，我见过的网页/论坛，它们都有应该刷新的 div 之外的按钮示例。

我有类似的东西：

<div class="abc">

    <ul class="typeA">
        <li><input name="regType34" onclick="javascript:loadRegister('34',$(this).attr('data-title'));" value="REG" type="radio" id="34_1" class="MyStyle" data-title="reg"  checked="checked">
        <label for="34_1" style="background-position: 0px -67px;">Register</label></li>
        <li><input name="regType34" onclick="javascript:loadGraph('34',$(this).attr('data-title'));" value="GRA" type="radio" id="34_2" class="MyStyle" data-title="gra"> <label for="34_2">Graph</label></li>
    </ul>
</div>

是否有可能当用户点击“regType34”时，完整的div“abc”会被刷新？

刷新意味着重新加载div的内容

【问题讨论】：

刷新是什么意思？你的意思是重新从服务器重新加载 div 的内容吗...如果是这样，检查状态会发生什么...是否应该保留用户检查的无线电...。

是的，我的意思是在check的基础上重新加载div的内容。checked状态应该根据用户检查的内容保留。

是的。我认为您可以在单选按钮上绑定一个单击事件处理程序，并在单击它时通过发送 ajax 请求刷新 div

就这样吧。通过使用 jquery 中的 onclick 函数，并给出一个检查单选按钮是否被选中的条件。之后调用一个函数，在其中做你需要的任何事情。

【参考方案1】：

Try this :
    $("input[name=regType34]").click(function()
    $("#abc").html("html that you want to show on div refresh");
    )

【参考方案2】：

请按照下面的 JQuery 代码来刷新单选按钮上的 div 元素。我在下面编写了 jQuery 代码，并在加载初始页面状态和每次点击收音机时调用它。

jQuery :

$(document).ready(function()  

    function refreshMe()
        $("#loading").show();

        var dt = new Date();
        var time = dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds();
        $("#refreshDiv").html(time);
        $("#loading").hide();
    

    // call the method on radio click:
    $(document).on('click', '#myRadio', function(e)
        e.preventDefault();
        refreshMe();
    );

    // call the method when page is opened:
    refreshMe();

);

HTML：

<input type='radio' id='myRadio'>
<div id='refreshDiv'></div>

例如你可以骑jsfiddle

如果您对此有任何疑问/疑虑，请告诉我。

【讨论】：

在OP中提到的情况下，单选按钮在需要刷新的div内。

请检查 [this](jsfiddle.net/sk4bxmpr/3/)。 html() 函数将替换 div 的全部内容，因此您可以根据需要使用它。根据您的要求更新代码。如果您有任何进一步的疑问/疑虑，请告诉我。

【参考方案3】：

试试这个代码：

function loadRegister(val, myAttrData)
 $("div.abc").text("Hello! My value is="+val+" and Data is="+myAttrData);

同样，您也可以编写 loadGraph()。如果对您有帮助，请告诉我。