自定义选项值取决于屏幕大小

Question

以下内容目前正在我的网页中使用。

<script id="score" type="text/template">
    <select name="scoreSelector">
        <option value="" disabled selected>Your Score</option>
        <option value="0.25">Quarter</option>
        <option value="0.50">Half</option>
        <option value="0.75">Three Quarter</option>
    </select>
</script>

如何根据屏幕宽度设置每个选项的值？

实施例

var width = $(window).width();
if (width <= 1023) {
    //set <option value="0.25">Quarter</option>
} else {
    //set <option value="0.35">Quarter</option>
}

Answer 1

您可以这样做：

var width = $(window).width();
if (width <= 1023) {
    $('select[name=scoreSelector]').val('0.25');
} else {
    // etc.
}