为文本框赋值

Question

您好，我有一个单选按钮（StarRating radiobutton 使用 jquery）和一个文本框。当我点击星星时，我希望单选按钮的值显示到文本框。

<input id="InsRating1" class="star" type="radio" name="InsRating" value="1" title="Worst"/>
<input id="InsRating2" class="star" type="radio" name="InsRating" value="2" title="Good"/>

我尝试将 Onclick() 放入其中，但 onClick() 从未被触发。 请建议如何从我的单选按钮获取值到文本框。谢谢

我在下面尝试过，但值为“未定义”

$(document).ready(function() {

    $('#InsRating1').click(function() {
        alert(this.value)

    });

});

----------编辑----------
我在下面使用 g_thom 的答案，但遇到了这个问题： 我有 3 组带有 3 个文本框的星星。每个评级应仅显示 1 个文本框。 但是，无论何时单击任何星，它都会将值显示给所有 3 个文本框，而不仅仅是指定的一个。请指教。谢谢

<script type="text/javascript">

$(函数() {
$('.star-rating').click(function() { // 将“总星数”的值分​​配给 id 为 ratingText 的文本框 $('#EvaluationInstructorRatingTextBox').val($('.star-rating-on').length);
}); $('.rating-cancel').click(function() { // 当点击取消按钮时值为 '0' $('#EvaluationInstructorRatingTextBox').val('0'); });

$('.star-rating').click(function() {
    // assign the value of "total stars" to a textbox with an id of ratingText
    $('#EvaluationMaterialRatingTextBox').val($('.star-rating-on').length);
});
$('.rating-cancel').click(function() {
    // the value is '0' when the cancel button is clicked
    $('#EvaluationMaterialRatingTextBox').val('0');
});


$('.star-rating').click(function() {
    // assign the value of "total stars" to a textbox with an id of ratingText
    $('#EvaluationValueRatingTextBox').val($('.star-rating-on').length);
});
$('.rating-cancel').click(function() {
    // the value is '0' when the cancel button is clicked
    $('#EvaluationValueRatingTextBox').val('0');
});

});

Answer 1

由于输入被转换为 div（“评分星”被分配到不同的类），我认为您需要计算具有 .star-rating-on 类的 div 的数量并将该值分配给输入，像这样：

$('.star-rating').click(function() {
    // assign the value of "total stars" to a textbox with an id of ratingText
    $('#ratingText').val($('.star-rating-on').length);
});

看起来很无聊的例子 - 没有实际的图形/动画（只有插件页面上转换输入的 HTML - 值将始终为 4）：http://jsfiddle.net/bhf2d/

编辑

上面的代码应该可以工作。我想你可能会想你需要将你的 jQuery 应用到单选按钮上，但事实并非如此，因为它在页面加载时用 div 换掉了。以防您不清楚，我使用您在问题中提供的代码添加了一个实时示例：Click here to see it。

编辑 2

参见an updated version here，符合设置多个复选框的附加要求。文本框已稍微重命名（InsRatingText0 等），以便于轻松添加更多项目。命名约定 InsRatingText[n] 设置为匹配插件动态添加的 div 类（'rater-0'、'rater-1' 等）

Answer 2

这些<input> 元素未被点击，因为它们被隐藏并被<div> 元素替换。您应该改用 onChange() 事件。

此外，单选按钮不使用属性value，而是使用checked。

Answer 3

试试这样的

$(function (){
    $(".star").click(function(){
       $("#textbox1").val($(this).val());
     });
});

基本上，它是将 onclick 的处理程序添加到具有 class="star" 的 eloement 中，然后将该值复制到文本框。

Answer 4

$(".star").bind('click', function() {
  $("#ratingValue").val($(this).text())
});

似乎在复选框上获取 val() 不起作用，但使用 text() 给出了值。这是工作示例：jsfiddle