Javascript $（“.starOne”）。替换为（“”）； $（“.starTwo”）。替换为（“”）； $（“.starThree”）。替换为（“”）； $（“.starFour”）。替换为（“”）； $（“.starFive”）。替换为（“”）； $（函数（） { StarOneHandler（）； StarTwoHandler（）； StarThreeHandler（）； StarFourHandler（）； StarFiveHandler（）； }); }); }

您是否尝试为输入设置id，并为标签设置for属性

<label class="starRadioButton" for="rating4"><input type="radio" id="rating4" name="Rating" value="4" />

     <img title="Very Good" alt="4" class="starFour" src="~/Content/star-grey.png" /></label>

我认为IE在标签/输入方面比其他浏览器更严格

---

如果没有帮助，请尝试为输入设置Id，并使用（例如）$（“#rating4”）.attr（“选中”，true）展开单击事件侦听器。

首先，在输入上设置Id，并在标签上设置for属性

<label class="starRadioButton" for="radioOne">

    <input type="radio" id="radioOne" name="Rating" value="4" />

    <img title="Very Good" alt="4" class="starFour" src="~/Content/star-grey.png" />

</label>

下面是解决此问题的修改后的事件侦听器：

function StarOneHandler()
{
    $(".starOne").on("click", function ()
    {
        $(".starOne").replaceWith('<img class="starOne" src="/Content/star-red.png" />');
        $(".starTwo").replaceWith('<img class="starTwo" src="/Content/star-grey.png" />');
        $(".starThree").replaceWith('<img class="starThree" src="/Content/star-grey.png" />');
        $(".starFour").replaceWith('<img class="starFour" src="/Content/star-grey.png" />');
        $(".starFive").replaceWith('<img class="starFive" src="/Content/star-grey.png" />');
        $(function ()
        {
            StarOneHandler();
            StarTwoHandler();
            StarThreeHandler();
            StarFourHandler();
            StarFiveHandler();
        });

        //$("#radioOne").attr("checked", true);
        document.getElementById("radioOne").checked = true;
    });
}

函数StarOneHandler（） { $（“.starOne”）。在（“单击”，函数（） { $（“.starOne”）。替换为（“”）； $（“.starTwo”）。替换为（“”）； $（“.starThree”）。替换为（“”）； $（“.starFour”）。替换为（“”）； $（“.starFive”）。替换为（“”）； $（函数（） { StarOneHandler（）； StarTwoHandler（）； StarThreeHandler（）； StarFourHandler（）； StarFiveHandler（）； }); //$（“#radioOne”）.attr（“选中”，为真）； document.getElementById（“radioOne”）.checked=true； }); }

---

注意，我注释掉了使用jQuery的最后一行，并将其替换为原始Javascript。如果您使用注释掉的jQuery行，则评级将停留在您在IE和Edge中首先单击的星星上，而不是Opera、Chrome、Mozilla、Safari或stock Android。使用

document.getElementById

行可以正常工作。我不知道为什么会发生这种情况。

另一种可能是根据javascript设置检查状态。将Id设置为输入，并使用$（“#rating4”）.attr（“checked”，true）或document.getElementById（“rating4”）.checked=true展开单击事件侦听器。或者触发一个点击事件，ike$（“#评级4”）。触发（“点击”）；将

$（“#rating4”）.attr（“checked”，true）

放入单击事件侦听器，效果非常好。把这个写在你的主要答案里，我会把它标为接受。虽然不是这个bug的通用解决方案，但它在这种情况下是有效的。我盲目地寻找CSS解决方案，忽略了显而易见的问题。非常感谢！很高兴，我可以帮忙：）虽然我犯了同样的错误，忽略了一个纯粹的css解决方案。我改变了我的主要答案。而不是听

img

听

标签上的内容。如果这不是一个选项，您可以尝试将
img
s放入包装器中，并聆听包装器上的单击。使用CSS，这样的星级评分可以变得更简单，而且不需要JS。如果你能改变这一点，我建议你查一些例子。我没有尝试过，因为下面的解决方案是有效的，但我希望它能帮助其他人。我同意CSS，谢谢。
<label class="starRadioButton" for="rating4"><input type="radio" id="rating4" name="Rating" value="4" />

     <img title="Very Good" alt="4" class="starFour" src="~/Content/star-grey.png" /></label>

<label class="starRadioButton" for="radioOne">

    <input type="radio" id="radioOne" name="Rating" value="4" />

    <img title="Very Good" alt="4" class="starFour" src="~/Content/star-grey.png" />

</label>

function StarOneHandler()
{
    $(".starOne").on("click", function ()
    {
        $(".starOne").replaceWith('<img class="starOne" src="/Content/star-red.png" />');
        $(".starTwo").replaceWith('<img class="starTwo" src="/Content/star-grey.png" />');
        $(".starThree").replaceWith('<img class="starThree" src="/Content/star-grey.png" />');
        $(".starFour").replaceWith('<img class="starFour" src="/Content/star-grey.png" />');
        $(".starFive").replaceWith('<img class="starFive" src="/Content/star-grey.png" />');
        $(function ()
        {
            StarOneHandler();
            StarTwoHandler();
            StarThreeHandler();
            StarFourHandler();
            StarFiveHandler();
        });

        //$("#radioOne").attr("checked", true);
        document.getElementById("radioOne").checked = true;
    });
}