在tpl文件的下拉选择中自动填充文本字段

Question

我有一个这样的下拉列表

   <div  class="constraint constraint-pattern , panel" {{#unless 
                constraints.pattern.selected}}style="display:none"{{/unless}} >
        <h3 class="full-width">{{__ "Select here"}}</h3>
        <select name="constraint" class="select2" data-has-search="false">
            <option value="[0-2]">abc</option>
            <option value="[2-4]">bcd</option>
            <option value="[4-9]">bnm</option>
        </select>
    </div>

从下拉列表中选择一个值时，我想填充文本区域。

    <div class="constraint constraint-pattern" {{#unless 
                constraints.pattern.selected}}style="display:none"{{/unless}}>
        <label>
            {{__ "Type"}}
        </label>

        <input type="text" readonly name="patternMask" value="abc"/>
    </div>