Question

我正在尝试使用Flask和MySQL设置一个小型Web应用程序，它从页面上的单选按钮获取信息并将其发送到数据库中。我对webdev很新，所以我仍然坚持从按钮实际获取信息。

这是我的单选按钮的HTML（剥离缩进）：

<div>
<input id="radioB" type="radio" name="radios" value="b" checked="checked">
<label for="radioB"><span><span></span></span>B</label>
</div>
<div>
<input id="radioT" type="radio" name="radios" value="t">
<label for="radioT"><span><span></span></span>T</label>
</div>

这是我的剧本：

$(function(){
    $('#btnSubmit').click(function(){
            $.ajax({
                    url: '/submit',
                    data: $('radios:checked').val(),
                    type: 'POST',
                    success: function(response){
                            console.log(response);
                    },
                    error: function(error){
                            console.log(error);
                    }
            });
    });
});

在我的烧瓶代码中，我试图使用：

来请求它

_info = request.form['radios']

当我目前试图运行时，我得到了一个

"POST /submit HTTP/1.1" 400 -

烧瓶日志中的

错误，让我相信我的问题出在我的脚本的'data'部分和/或烧瓶请求中。对此任何部分的任何帮助将不胜感激！

编辑：我已将我的HTML更改为：

    <form action ="/submit" form method="post">
    <div>
        <input id="radioB" type="radio" name="radios" value="b" checked="checked">
        <label for="radioB"><span><span></span></span>B</label>
     </div>
     <div>
         <input id="radioT" type="radio" name="radios" value="t">
         <label for="radioT"><span><span></span></span>T</label>
     </div>
     <input type="submit" id="btnSubmit">

和我的JS脚本：

$(function(){
$('#btnSubmit').click(function(){
        var radioValue = $("input[name=radios]:checked").val();
        alert(radioValue);
        $.ajax({
                url: '/submit',
                data: {value:radioValue},
                type: 'POST',
                success: function(response){
                        console.log(response);
                },
                error: function(error){
                        console.log(error);
                }
        });
    });
});

现在我在浏览器控制台中获取了上述JS脚本的错误情况，而不是我以前的错误。

Answer 1

不应该

$("input[name='radios']:checked").val()

如果您使用名字进行访问！

希望它有所帮助！

Answer 2

尝试$("input[name='radios']:checked").val();获取单选按钮值，希望您获得解决方案

＆＃13;

$(function(){
    $('#btnSubmit').click(function(){
            var radioValue = $("input[name=radios]:checked").val();
            alert(radioValue);
            $.ajax({
                    url: '/submit',
                    data: {value:radioValue},
                    type: 'POST',
                    success: function(response){
                            console.log(response);
                    },
                    error: function(error){
                            console.log(error);
                    }
            });
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method="post">
<div>
<input id="radioB" type="radio" name="radios" value="b" checked="checked">
<label for="radioB"><span><span></span></span>B</label>
</div>
<div>
<input id="radioT" type="radio" name="radios" value="t">
<label for="radioT"><span><span></span></span>T</label>
</div>
<input type="submit" id="btnSubmit">
</form>

＆＃13;

使用javascript从单选按钮获取值

2 个答案: