JS给Input文本框赋值怎么写？

zhaofeng0420 2014-05-18 07:58:11 
<div>

	<a href="#">网页</a>

	<a href="#">新闻</a>

	<a href="#">地图</a>

	<a href="#">音乐</a>

	<a href="#">图片</a>

</div>

<span>

	<input type="text" value=""></input>

</span>

点击 网页，则在input框中显示网页，当前被点击的标签加粗显示。
...全文
212493 13 打赏 收藏 转发到动态 举报
写回复
用AI写文章
13 条回复
切换为时间正序
请发表友善的回复…
发表回复
那沉默的懒猫 2014-05-21
  • 打赏
  • 举报
 回复
引用 8 楼 Return_false 的回复:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
a{color:#000;}
</style>
<script>
function selectTag(obj,vv){
	//假设所有a初始字体颜色为黑色
   document.getElementById("kw").value=vv;
   var parentNode=obj.parentNode;
   var aList=parentNode.children;
   for(var i=0;i<aList.length;i++)
   		aList[i].style.color='#000';
	obj.style.color='red';
}
</script>
</head>
<body>
<div>
    <a href="javascript:void(0)" onClick="selectTag(this,'网页')">网页</a>
    <a href="javascript:void(0)" onClick="selectTag(this,'新闻')">新闻</a>
    <a href="javascript:void(0)" onClick="selectTag(this,'地图')">地图</a>
    <a href="javascript:void(0)" onClick="selectTag(this,'音乐')">音乐</a>
    <a href="javascript:void(0)" onClick="selectTag(this,'图片')">图片</a>
</div>
<span>
    <input id="kw" type="text" value="" size="30"></input>
</span>
</body>
</html>
+1
人生难得一只鸡 2014-05-20
  • 打赏
  • 举报
 回复
可以，只要你设置好了对应的样式，很多时候，你可以自己尝试一下
zhaofeng0420 2014-05-20
  • 打赏
  • 举报
 回复
引用 8 楼 Return_false 的回复:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
a{color:#000;}
</style>
<script>
function selectTag(obj,vv){
	//假设所有a初始字体颜色为黑色
   document.getElementById("kw").value=vv;
   var parentNode=obj.parentNode;
   var aList=parentNode.children;
   for(var i=0;i<aList.length;i++)
   		aList[i].style.color='#000';
	obj.style.color='red';
}
</script>
</head>
<body>
<div>
    <a href="javascript:void(0)" onClick="selectTag(this,'网页')">网页</a>
    <a href="javascript:void(0)" onClick="selectTag(this,'新闻')">新闻</a>
    <a href="javascript:void(0)" onClick="selectTag(this,'地图')">地图</a>
    <a href="javascript:void(0)" onClick="selectTag(this,'音乐')">音乐</a>
    <a href="javascript:void(0)" onClick="selectTag(this,'图片')">图片</a>
</div>
<span>
    <input id="kw" type="text" value="" size="30"></input>
</span>
</body>
</html>

<script type="text/javascript">
function selectTag(obj,vv){
	document.getElementById("kw").value=vv;
	var parentNode=obj.parentNode;
	var aList=parentNode.children;
	for(var i=0;i<aList.length;i++)
	aList[i].style.color='#0000cc';
	obj.style.color='#000';
}
</script>
最后一句能这样写吗？obj.className='aaa';
zyzy15 2014-05-19
  • 打赏
  • 举报
 回复
除了3楼的方式还能用下面两种方式 1~3是一种，需要结合<style>使用 4、5是一种 

  <style>
  .b {color:black}
  .r {color:red}
  </style>
  <a href="#" class="b" onclick="this.className='r'">1</a>
  <a href="#" class="b" onclick="this.className='r'">2</a>
  <a href="#" class="b" onclick="this.className='r'">3</a>
  <a href="#" style="color:black" onclick="this.style.color='red'">4</a>
  <a href="#" style="color:black" onclick="this.style.color='red'">5</a>
人生难得一只鸡 2014-05-19
  • 打赏
  • 举报
 回复 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
a{color:#000;}
</style>
<script>
function selectTag(obj,vv){
	//假设所有a初始字体颜色为黑色
   document.getElementById("kw").value=vv;
   var parentNode=obj.parentNode;
   var aList=parentNode.children;
   for(var i=0;i<aList.length;i++)
   		aList[i].style.color='#000';
	obj.style.color='red';
}
</script>
</head>
<body>
<div>
    <a href="javascript:void(0)" onClick="selectTag(this,'网页')">网页</a>
    <a href="javascript:void(0)" onClick="selectTag(this,'新闻')">新闻</a>
    <a href="javascript:void(0)" onClick="selectTag(this,'地图')">地图</a>
    <a href="javascript:void(0)" onClick="selectTag(this,'音乐')">音乐</a>
    <a href="javascript:void(0)" onClick="selectTag(this,'图片')">图片</a>
</div>
<span>
    <input id="kw" type="text" value="" size="30"></input>
</span>
</body>
</html>
Cocl 2014-05-19
  • 打赏
  • 举报
 回复
选中的标签添加一个类，再在css写上相应样式就行，注意css的权重
___紫菜 2014-05-19
  • 打赏
  • 举报
 回复
引用 2 楼 zhaofeng0420 的回复:
[quote=引用 1 楼 yang_1224 的回复:] <input type="text" id="example" /> document.getElementById("example").value="somethind";
这个已经搞定了，还有一个问题：有5个<a>标签，分别为1、2、3、4、5，默认字体颜色为黑色，点击后改为红色？？？[/quote]a:link {color: #000000} /* 未访问的链接的颜色 */ a:visited {color: #d90a81} /* 已访问的链接的颜色 */ a:hover {color: #d90a81} /* 当有鼠标悬停在链接上的颜色 */ a:active {color: #d90a81} /* 被选择的链接的颜色 */
zhaofeng0420 2014-05-19
  • 打赏
  • 举报
 回复 
<script type="text/javascript">
function selectTag(vv){
   document.getElementById("kw").value=vv;
}
</script>
<div>
    <a href="javascript:void(0)" onClick="selectTag('网页')">网页</a>
    <a href="javascript:void(0)" onClick="selectTag('新闻')">新闻</a>
    <a href="javascript:void(0)" onClick="selectTag('地图')">地图</a>
    <a href="javascript:void(0)" onClick="selectTag('音乐')">音乐</a>
    <a href="javascript:void(0)" onClick="selectTag('图片')">图片</a>
</div>
<span>
    <input id="kw" type="text" value="" size="30"></input>
</span>
最终效果：点击<a>网页</a>标签后赋值给文本框，并把当前标签设为选中状态，即改字体为红色，当点击另一个标签<a>新闻</a>后则恢复上次被点击的颜色。
zhaofeng0420 2014-05-19
  • 打赏
  • 举报
 回复
引用 5 楼 zyzy15 的回复:
除了3楼的方式还能用下面两种方式 1~3是一种，需要结合<style>使用 4、5是一种 

  <style>
  .b {color:black}
  .r {color:red}
  </style>
  <a href="#" class="b" onclick="this.className='r'">1</a>
  <a href="#" class="b" onclick="this.className='r'">2</a>
  <a href="#" class="b" onclick="this.className='r'">3</a>
  <a href="#" style="color:black" onclick="this.style.color='red'">4</a>
  <a href="#" style="color:black" onclick="this.style.color='red'">5</a>
点击1时，1为红色，点击2时，2为红色，还原1为默认颜色
zhaofeng0420 2014-05-18
  • 打赏
  • 举报
 回复
引用 1 楼 yang_1224 的回复:
<input type="text" id="example" /> document.getElementById("example").value="somethind";
这个已经搞定了，还有一个问题：有5个<a>标签，分别为1、2、3、4、5，默认字体颜色为黑色，点击后改为红色？？？
yang_1224 2014-05-18
  • 打赏
  • 举报
 回复
<input type="text" id="example" /> document.getElementById("example").value="somethind";
js点击表格赋值文本框.html
点击表格复制到input，js
JS简单获取并修改input文本框内容的方法示例
主要介绍了JS简单获取并修改input文本框内容的方法,结合实例形式分析了JavaScript针对页面元素的获取、赋值等相关操作技巧,需要的朋友可以参考下
input子系统基础之按键-linux驱动开发第8部分
本课程是linux驱动开发的第8个课程，主要内容是linux的input子系统。学习本课程的目标是对input子系统的框架结构有深入理解，应用层和驱动层的调用关系和方法完全了解，能够自己移植按键等常见输入类设备的驱动。
JS实现下拉菜单赋值到文本框的方法
本文实例讲述了JS实现下拉菜单赋值到文本框的方法。分享给大家供大家参考。具体如下： 这里演示下拉菜单和文本框构建的介绍栏，将Select框中的值定位到INPUT文本输入框中，是下拉框赋值到文本框的实例，上网时候貌似经常见的功能，只是不知如何形容，或许叫做联动吧。 运行效果如下图所示： 在线演示地址如下： http://demo.jb51.net/js/2015/js-select-to-input-val-codes/ 具体代码如下： <html> <head> [removed] <!-- Begin var messages = new Arr
jquery复选框多选赋值给文本框的方法
本文实例讲述了jquery复选框多选赋值给文本框的方法。分享给大家供大家参考。具体实现方法如下： 代码如下:<!DOCTYPE html>  <html xmlns=”http://www.w3.org/1999/xhtml”>  <head>  <title>jquery点击复选框触发事件给input赋值</title><base target=”_blank” />  <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />  <style type=”text/css”>  * {  mar
JavaScript

87,902

社区成员

224,615

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章