javascript - 使用 jQuery 更改选择选项时更改占位符

标签 javascript jquery forms onchange

我有一个网站,在页面的不同位置具有相同的形式。当我更改选择选项时,我希望能够在文本输入中更改占位符。我有一个 JSFiddle ,有一个例子: http://jsfiddle.net/y1jhhqLz/

所有表单如下所示:

<form id="form1">
    <select id="mySelect1" onClick="changePlaceHolder('#mySelect1','#myInput1')">
        <option value='-1'>Form 1</option>
        <option value='First'>First Choice</option>
        <option value='Second'>Second Choice</option>
        <option value='Third'>Third Choice</option>
    </select> 
    <input id="myInput1" type="text" placeholder="Form 1"></input>
    <input class="dontChangeME" type="text" placeholder="Don't Change This One!"></input>
</form>

在此示例中,当我选择选项 Third 时,我希望更改 ID 为 myInput 的输入上的占位符。

我尝试了很多不同的方法来包含最近的尝试,我将其放在 JSFiddle 上。

任何帮助将不胜感激!

最佳答案

将 select onclick 属性设置为

onclick="changePlaceHolder(this,'#myInput1');"

并将 JavaScript 函数更改为

function changePlaceHolder(dropdown, element) {
    if (jQuery(dropdown).val() == "Third") {
         jQuery(element).attr('placeholder', 'You did it correctly!');   
    } else {
         jQuery(element).at}tr('placeholder', '');   
    }
}

在 JSFiddle 中,您应该将加载行为设置为“不包含在 head 中”

enter image description here

完成!

关于javascript - 使用 jQuery 更改选择选项时更改占位符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31012539/

相关文章:

javascript - 将数组中的第一项包装在标签中,并将以下项目包装在其他一些标签中

javascript - 无法将图 block 集和 map 加载到我的 Phaser3 游戏中

javascript - 如何让 jquery animate 看起来更流畅?

php - Symfony2 : $form->isValid() is always true

php - HTML 表单中的文本输入不会显示

javascript - 结合图片上传ajax和表单提交ajax

javascript - 如何让 slider 长度变短并出现在页面中央?

jquery - 过渡顺利回到原来的状态

javascript - 在 CTRL+MOUSEWHEEL 事件上

php - 使用ajax将php文件加载到div中