带复选框的文本区域占位符
Textarea placeholder with a checkbox
我正试图通过按下复选框按钮来更改文本区域的占位符。我就是无法改变。
为了清楚起见,我试图设置一个占位符而不是一个值。
我的文本区域:
<textarea name="problem" id="problem" rows="3" class="form-control" cols="45" placeholder="Describe your ticket reason in as few words as possible."></textarea>
我的JavaScript:
<div class="onoffswitch">
<input type="checkbox" onchange="changeplh()" name="onoffswitch" class="onoffswitch-checkbox" value="1" id="myonoffswitch" checked>
<label class="onoffswitch-label" for="myonoffswitch">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
<script>
function changeplh() {
debugger;
var sel = document.getElementById("myonoffswitch");
var textbx = document.getElementById("problem");
var indexe = sel.selectedIndex;
if (indexe == 0) {
$("#problem").val('');
$("#problem").prop("placeholder", "age");
}
if (indexe == 1) {
$("#problem").val('');
$("#problem").prop("placeholder", "name");
}
}
</script>
</div>
我特别需要的是一个复选框按钮,它将文本区域的占位符更改为两个不同的选项。EX:点击一下,上面写着"年龄";,再次点击它,它会说";name";,再次点击它,它会说";年龄;等等
您的代码有点乱(例如,您的代码中没有#problem
),所以我只创建了一个更改placeholder
的简单演示。
$('#problem').change(function() {
$('textarea').attr('placeholder', $(this).is(':checked') ? 'name' : 'age');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea class="form-control" style="height:150px" name="techProblem" placeholder="Describe the issue in as few words as possible."></textarea>
<label><input type="checkbox" id="problem" /> Change placeholder</label>
相关文章:
- 使用javascript的Asp.net内容占位符
- Internet Explorer缺少占位符支持,特别是密码字段
- 如何隐藏按钮单击事件上的占位符
- 需要URL模板占位符查找和替换功能的输入
- 初始化ng模型时,Angular ui选择占位符不起作用
- 如何在ie7或更高版本中设置密码字段的占位符
- 如何更改文本区域的颜色's文本,具体取决于它是否为占位符
- 文本区域的Internet Explorer占位符
- IE10+上的AngularJS,带有占位符原因的文本区域“;无效参数&”;
- 通过jQuery在文本区域占位符内新建一行
- 基于PHP if条件更改文本区域占位符文本
- 文本区域的自定义占位符
- 如何使用纯 JavaScript 在文本区域标签中定位占位符值
- 如何在未选择文本区域时显示占位符
- 占位符在文本区域中不起作用
- 修改用户语音文本区域占位符
- 带复选框的文本区域占位符
- 占位符-用于文本区域输入
- 谷歌地图忽略占位符容器的区域
- 如何有一个占位符文本的每一个新的文本区域行