Question

我的网站上有一个新闻管理脚本，允许我添加，更新和删除新闻。我已经决定采用jQuery来使事情更顺畅，虽然我已经让添加/编辑/删除部分工作，但我想在默认页面上添加一个简单的功能来进行新闻编辑

当您访问默认新闻页面时，您会看到之前新闻帖子的简单列表。显示的列是：

新闻标题，作者，发布日期，有效，编辑

对于＆＃34; Active＆＃34;我希望一个简单的开关设置为＆＃34; Active＆＃34;或＆＃34;无效。＆＃34;一旦翻转该开关，就更新相应的新闻帖子而不重新加载整个页面。它只是执行。

（用户界面的旁注：我也希望为该新闻帖子的表格的单元格颜色设置动画，但这是我以后可以解决的问题）

目前news-list.php脚本加载每一行，如下所示：

$news_edit_options .= "<tr id=\"" . $row["newsid"] . "\">";
$news_edit_options .= "     <td>" . $row["title"] . "</td>";
$news_edit_options .= "     <td>" . $row["login"] . "</td>";
$news_edit_options .= "     <td>" .$row["date_released"] . "</td>";
$news_edit_options .= "     <td>";
$news_edit_options .= "       <form method=\"post\" action=\"news-activator.php\" class=\"news-activator\">";
$news_edit_options .= "          <input type=\"hidden\" name=\"newsid\" value=\"" . $row["newsid"] . "\">";
$news_edit_options .= "          <input type=\"radio\" name=\"active\" value=\"0\"";
if ($row["active"] == 0) {
     $news_edit_options .= " checked";
}
$news_edit_options .= "> inactive <br />";

$news_edit_options .= " <input type=\"radio\" name=\"active\" value=\"1\"";
if ($row["active"] == 1) {
     $news_edit_options .= " checked";
}
$news_edit_options .= "> active";
$news_edit_options .= "  </form>";
$news_edit_options .= "</td>";
$news_edit_options .= "     <td><button type=\"button\" class=\"btn btn-primary newsbutton\" data-toggle=\"modal\" data-target=\"#newsModal\" id=\"" . $row["newsid"] . "\">Edit</button></td>";
$news_edit_options .= "</tr>";

工作正常。现在进入jQuery：

$.when(LoadAPage('#news-list','news-list.php')).done(function() {
    $("input[type=radio]").change(function() {
        $(this).closest("form").submit(function() {
        // do stuff here
        });
    });
});

这不起作用。 .submit(function() {});部分平坦无效。但是，当我将其更改为：

$.when(LoadAPage('#news-list','news-list.php')).done(function() {
    $("input[type=radio]").change(function() {
        $(this).closest("form").submit();
    });
});

那＆＃39; ll＆＃34;工作，＆＃34;但是表单只是提交，我无法用jQuery捕获数据并完成我想做的所有事情。我确实尝试过复选框，但遇到了同样的问题。

我有一种感觉，我只是错过了一些东西或接近这一切都错了。有什么想法吗？

Answer 1

试试这个。我认为你在两次尝试中只有一半，你只需将它们组合在一起：）

$.when(LoadAPage('#news-list','news-list.php')).done(function() {
    $("input[type=radio]").change(function() {
        $(this).closest("form").submit(function(e) {
           e.preventDefault();
           alert("the form was submitted");
        });
        $(this).closest("form").submit();
    });
});

第一个提交函数告诉jQuery提交表单时要做什么。 e.preventDefault();阻止默认操作（在您有时间执行任何其他jQuery之前提交表单并重新加载页面）。

第二个.submit();触发表单提交，该表单提交运行我们的提交处理函数中的代码。

通过单选按钮更改提交Jquery表单

1 个答案: