Question

我创建了一个输入框，如果更改了选择框的所选选项，则占位符也会更改。请看一下小提琴：https://jsfiddle.net/dL2aqckj/2/

这是html：

<select id="selector">
<option value="book">Book</option>
<option value="journal">Journal</option>
<option value="newspaper">Newspaper</option>
</select>
<input type="text" id="searchbox" placeholder="Find Book" size="20">

这是JavaScript：

var selector = $("#selector");
var searchbox = $("#searchbox");

selector.on("change", function () {

  searchbox.attr('placeholder', "Find " + selector.find(':selected').text()
)});

这一切都很好。现在，我希望占位符包含自定义文本，而不仅仅是选择框选项的名称。因此，我试图将选择框所选选项与某些占位符文本进行匹配。这是小提琴：https://jsfiddle.net/2x5m746e/1/

JavaScript代码：

var placeholderText = {
    "book": "Enter book ID",
    "journal": "Enter journal ID",
    "newspaper": "Enter newspaper ID",
};

var selector = $("#selector");    
var searchbox = $("#searchbox");  

selector.on("change", function () {

  searchbox.attr('placeholder', searchbox.val(placeholderText[selector.find(':selected').text()])
)});

它不能正确更改占位符。我究竟做错了什么？任何建议都非常感谢！

Answer 1

由于您在if request.POST: data ['formset'] = ExamDateFormSet(request.POST, instance = self.object)对象中的键是placeholderText，book和journal，因此您想要获得newspaper或placeholderText['book']。

因此，您应该获取值而不是所选项目的文本，因为在您的HTML代码中，选项中的值是placeholderText['journal']，book和journal。

newspaper

var placeholderText = {
	  "book": "Enter book ID",
    "journal": "Enter journal ID",
    "newspaper": "Enter newspaper ID",
};

$("#selector").on("change", function () {
  $("#searchbox").attr('placeholder', placeholderText[$(this).find(':selected').val()]);
});

使用jQuery更改选择框选项时更改输入框占位符

1 个答案: