编写页面显示“这里是调料柜台,欢迎选购您喜欢的调料。”字体颜色为蓝色,点击后可访问商品购物页面food.jsp;换行显示“欢迎修改会员卡号!”字体颜色为紫色,点击后可访问用户登录页面loginID.jsp;同时将顾客的账号保存到session的userid属性中
时间: 2024-10-15 22:23:21 浏览: 22
为了实现这个需求,你可以创建一个HTML页面结合CSS样式和超链接。下面是一个示例:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<style>
.blue-text {
color: blue;
}
.purple-text {
color: purple;
cursor: pointer;
text-decoration: underline;
}
</style>
</head>
<body>
<div class="blue-text">
<a href="food.jsp">这里是调料柜台,欢迎选购您喜欢的调料。</a>
</div>
<p class="purple-text" onclick="goToLoginPage(event)">
欢迎修改会员卡号!<span id="loginLink">(点击这里)</span>
</p>
<script>
function goToLoginPage(e) {
e.preventDefault(); // 阻止默认跳转
sessionStorage.userid = 'your_customer_id'; // 保存用户ID到session
window.location.href = "loginID.jsp";
}
</script>
</body>
</html>
```
在这个示例中,`<a>`标签用于链接到其他页面,`.blue-text`和`.purple-text`是CSS类,分别设置了文字颜色。`onclick`事件处理函数`goToLoginPage`会在用户点击紫色文字时执行,阻止默认跳转并设置`sessionStorage.userid`,然后跳转到`loginID.jsp`。
注意,由于实际项目中可能涉及到用户安全以及防止跨站请求伪造(CSRF),在真实的网页应用中,通常不会直接在页面上硬编码用户ID,而应该从服务器端生成安全的链接。
阅读全文