Question

我正在将一个对象school传递到我的编辑表单中，并希望将其中一个选项设置为选中状态。学校有一个属性focus，用于JavaScript school.focus = 1，Python school.focus = 2和Ruby on Rails school.focus = 3）

如何编写内联条件以将其中一个选项设置为“已选择”？

//- Focus
div(data-role='fieldcontain')
  fieldset(data-role='controlgroup')
    label(for='focus') Focus
      select(name='focus')
        option(value='JavaScript') JavaScript
        option(value='Python') Python
        option(value='Ruby on Rails') Ruby on Rails

当有赋值（value =）时，我已经使这种类型的内联条件有效：

//- School Name
    div(data-role='fieldcontain')
      fieldset(data-role='controlgroup')
        label(for='school_name') School Name
          input(id='school_name',type='text', value=(school ? '#{school.school_name}' :     ''),placeholder='School name here',name='school_name')

Answer 1

幸运的是，Jade很棒，你根本不需要使用三元组。 KISS。

div
  fieldset
    label Focus
      select
        option(value='JavaScript', selected=(school.focus == 1)) JavaScript
        option(value='Python', selected=(school.focus == 2)) Python
        option(value='Ruby on Rails', selected=(school.focus == 3)) Ruby on Rails

所以，如果locals.school.focus是2，那么你最终得到这个标记：

<div>
  <fieldset>
    <label>Focus
      <select>
        <option value="JavaScript">JavaScript</option>
        <option value="Python" selected="selected">Python</option>
        <option value="Ruby on Rails">Ruby on Rails</option>
      </select>
    </label>
  </fieldset>
</div>

演示@ http://jsfiddle.net/mattball/Razge/

我建议稍微重构以将值和标签与标记分开，这样你就可以让Jade为它们迭代它们，但这是一般的想法。

N.B。如果标签是您要标记的元素的父级，则可以完全省略标签的for属性。 In spec-speak, that's:

如果未指定for属性，但label元素具有可变元素后代，则树顺序中的第一个此类后代是标签元素的标记控件。

...所有这些都说：在你的情况下，该标签的for属性是多余的，你可以摆脱它。

在玉中内联条件？

1 个答案: