解决this.disabled=true，不能执行服务器端代码的问题

ASP.NET按钮点击事件
最新推荐文章于 2023-02-20 23:54:10 发布
转载 最新推荐文章于 2023-02-20 23:54:10 发布 · 2.2k 阅读 · 0

本文介绍了一个ASP.NET页面中的按钮点击事件处理方式。通过一个示例展示了如何使用Button控件，并在点击时隐藏该按钮同时显示另一个提示按钮。这种方法常用于表单提交过程中显示加载状态。
    <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" OnClientClick="this.style.display='none';btnokHide.style.display='block';" />
    <input id="btnokHide"  type="button" value="正在提交..." style="display:none;" disabled="disabled" />
Asp.Net中避免重复提交和弹出提示框的实例代码
01-20
这个实例代码展示了如何通过JavaScript和服务器端代码实现这两个功能。 首先，让我们详细解析前端代码： ```html <asp:Button ID="Button1" runat="server" Text="打印" onclick="Button1_Click" OnClientClick=...
.NET中TextBox控件设置ReadOnly=true后台取不到值三种解决方法
10-27
方法二利用服务器端的Request对象来确保能够获取到值，适用于需要将ReadOnly状态设置为true并保持其不可编辑的场景。方法三则结合了页面首次加载和服务器端的特性，在页面加载时动态设置ReadOnly属性，确保在非回发...
单击服务器控件button时不运行服务器端代码，只运行javascript代码
狂风专栏
10-08 1031
BT_Func.Attributes.Add("onclick","javascript:yourJSFunc(); return false;")orBT_Func.Attributes.Add("onmousedown","javascript:event.cancelBubble=true;event.returnValue=false; return false;")
解决this.disabled=true;不能执行服务器端代码的问题(点击后按钮变不可用状态)
weixin_33832340的博客
03-18 300
代码 &lt;%@ Page Language="C#" AutoEventWireup="true" CodeFile="Enable.aspx.cs" Inherits="test_Enable" %&gt;&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w
input type="button" onClick="this.disabled=true;document.getElementById(btnSend) .click();value="Go!...
weixin_33842328的博客
08-22 336
How to call a javascript function from a HTML button on a user control http://www.issociate.de/board/post/245473/How_to_call_a_javascript_function_from_a_HTML_button_on_a_user_control.htmlI have a use...
disabled=“true“是什么意思？
weixin_44928129的博客
02-20 2027
disabled="true"是什么意思？
disable到底是指什么
weixin_49393290的博客
10-08 1818
您看这个@click新增的方法，注意看新增没有传参，但是查看和修改穿了 <el-button v-if="isAuth('pesticide:crop:save')" type="primary" @click="addOrUpdateHandle()" >新增</el-button> <template slot-scope="scope">
Vue 中 disabled 的用法
热门推荐
sensor_WU 博客
10-26 1万+
<nut-button @click="clickHandler" :disabled='disabled' > 去结算 </nut-button> <!-- 这个是引用 NUTUI 的 button --> data(){ return{ disabled...
loginBtn.addEventListener('click', function(e) { e.preventDefault(); // 添加点击动画效果 const originalText = this.innerHTML; this.innerHTML = '<i class="fas fa-spinner fa-spin"></i> 登录中...'; this.disabled = true; // 模拟登录过程和动画效果 setTimeout(() => { this.innerHTML = '<i class="fas fa-check"></i> 登录成功'; setTimeout(() => { this.innerHTML = originalText; this.disabled = false; }, 1500); }, 1500); });添加登录PHP验证页
最新发布
09-19
this.disabled = true; // 获取表单数据 const username = document.querySelector('#username').value; const password = document.querySelector('#password').value; // 发送AJAX请求 fetch('login.php',...
//表单初始化 function initForm(){ var d; fm.CurrentDate.value = "<%=CurrentDate%>"; fm.CurrentTime.value = "<%=CurrentTime%>"; d = new Date()； //简易投保没有告知 if (BussSubType == "08"){ fm.pagename.value = "1108";} //意外险投保单投保人没有告知，被保人 if (BussSubType =="06"){ fm.pagename.value = "1106";} //经代寿险投保书 if (BussSubType == "09"){ fm.pagename.value ="1109"；} //经代万能投保书 if (BussSubType == "10"){ fm.pagename.value = "1110";} //经代寿险投保书 if (BussSubType == "31"){ fm.pagename.value = "1131";} //经代万能投保书 if (BussSubType == "33"){ fm.pagename.value = "1133";} //个险经代投保书（新版） if (BussSubType =="04"){ fm.pagename.value = "1104"; } //个险经代意外投保书（新版） if (BussSubType == "11"){ fm.pagename.value = "1111";} //个险寿险投保书（新版） if (BussSubType =="41"){ fm.pagename.value = "11";} //个险意外投保书（新版） if (BussSubType =="43"){ fm.pagename. value = "1143"; } //个险VIP投保书（新版） if (BussSubType == "42"){ fm.pagename.value ="1142";} //个险逍遥贷专用 if (BussSubType == "48"){ fm.pagename.value = "1148"；} //Q：scantype是判断是否有扫描件，用于定制随动 if(scantype=="scan"){ setFocus();} else{ fm.appntdiseaseimpart.disabled=true ; fm.appnthealimpart.disabled=true ; fm.insufinaimpart.disabled=true ; fm.insuhealimpart.disabled=true ; fm.insudiseaseimpart.disabled = true;} //初始化业务员告知 initAgentImpartGrid() ; //初始化投保人告知信息 initImpartGrid() ； //初始化工作流任务节点 initMissionID() ; //初始化多业务员列表 initMultiAgentGrid() ; //判断是否是有扫描件 /* *ScanFlag=0--有扫描 *ScanFlaa=1--下扫描*/ if(this.ScanFlag == "1"){ if(fm. SaleChnl.value=="10"){ if(BussSubType=="58"||BussSubType=="59"||BussSubType=="64"||BusssubType=="65"||BussSubType=="60"||BussSubType=="61"||BussSubType=="62"|| BussSubType=="63"||BussSubType=="78") { frtype.style.display=""; }else{ if(fm. SaleChnl.value=="10"){ frtype.style.display="" ; }} if(this.ScanFlag == "0"){ //根据需求PrtNo中存投保单号，故将投保单号字段赋值 fm.all('PrtNo').value = prtNo; fm.all('PrtNo2').value = prtNo; fm.all('ProposalContNo').value = prtNo; fm.a11('ContNo').value = prtNo; fm.all('ManageCom').value = ManageCom; fm.all('ActivityID').value = ActivityID; fm.al1('NoType').value = NoType; fm.PrtNo.readOnly=true; if(this.ScanFlag =="1"){ fm.all('PrtNo').value = prtNo; fm.all('PrtNo2').value = prtNo; fm.all('ProposalContNo').value = prtNo; fm.all('ContNo').value = prtNo; fm.all('ManageCom').value = ManageCom; fm.all('ActivityID').value = ActivityID; fm.all ('NoType').value = NoType; fm.PrtNo.readOnly=true;} //初始化”是否选择电子保单“ //判断是否是银保通非实时单 checkYBT()； 给上述代码添加详细的注释，并解释相关方法
03-14
然后给表单的CurrentDate和CurrentTime赋值，使用服务器端变量<%=CurrentDate%>和<%=CurrentTime%>，这部分应该是初始化当前日期和时间。接下来创建了一个Date对象，但暂时没看到使用的地方，可能需要后续检查是否有...
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>WebRTC视频流客户端</title> <style> body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; max-width: 100%; margin: 0 auto; padding: 20px; background-color: #f5f5f5; } h1 { color: #2c3e50; text-align: center; margin-bottom: 30px; } #videoContainer { position: relative; width: 1200px; height: 600px; margin: 0 auto; background-color: #000; border-radius: 4px; overflow: hidden; } #video { width: 100%; height: 100%; object-fit: cover; background-color: #000; } #videoError { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: white; font-size: 24px; background-color: rgba(0, 0, 0, 0.7); z-index: 10; } #controls { display: flex; justify-content: center; gap: 15px; margin-bottom: 20px; } button { padding: 10px 25px; border: none; border-radius: 4px; font-size: 16px; cursor: pointer; transition: all 0.3s; } #startButton { background-color: #3498db; color: white; } #stopButton { background-color: #e74c3c; color: white; } button:disabled { opacity: 0.6; cursor: not-allowed; background-color: #95a5a6 !important; } #status { padding: 15px; text-align: center; border-radius: 4px; margin-bottom: 20px; font-weight: bold; color: white; } .status-waiting { background-color: #7f8c8d; } .status-connecting { background-color: #f39c12; } .status-connected { background-color: #2ecc71; } .status-error { background-color: #e74c3c; } #debugPanel { background-color: white; border-radius: 4px; padding: 20px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); } .debug-section { margin-bottom: 15px; } .debug-section h3 { margin-top: 0; color: #2c3e50; border-bottom: 1px solid #eee; padding-bottom: 5px; } .debug-row { display: flex; margin-bottom: 8px; } .debug-label { width: 120px; font-weight: bold; } .debug-value { flex-grow: 1; font-family: monospace; } #videoStats { background-color: #f8f9fa; padding: 10px; border-radius: 4px; } </style> </head> <body> <h1>WebRTC视频流客户端</h1> <div id="videoContainer"> <video id="video" autoplay playsinline ></video> <div id="videoError">等待连接...</div> </div> <div id="controls"> <button id="startButton">开始连接</button> <button id="stopButton" disabled>停止连接</button> </div> <div id="status" class="status-waiting">状态: 等待连接</div> <div id="debugPanel"> <div class="debug-section"> <h3>连接状态</h3> <div class="debug-row"> <span class="debug-label">ICE状态:</span> <span id="iceState" class="debug-value">-</span> </div> <div class="debug-row"> <span class="debug-label">信令状态:</span> <span id="signalingState" class="debug-value">-</span> </div> <div class="debug-row"> <span class="debug-label">连接状态:</span> <span id="connectionState" class="debug-value">-</span> </div> </div> <div class="debug-section"> <h3>视频信息</h3> <div id="videoStats"> <div class="debug-row"> <span class="debug-label">轨道状态:</span> <span id="trackState" class="debug-value">-</span> </div> <div class="debug-row"> <span class="debug-label">分辨率:</span> <span id="videoResolution" class="debug-value">-</span> </div> <div class="debug-row"> <span class="debug-label">帧率:</span> <span id="videoFramerate" class="debug-value">-</span> </div> <div class="debug-row"> <span class="debug-label">最后错误:</span> <span id="lastError" class="debug-value">无</span> </div> </div> </div> </div> <script> class WebRTCClient { constructor() { // DOM元素 this.videoElement = document.getElementById('video'); this.videoError = document.getElementById('videoError'); this.startButton = document.getElementById('startButton'); this.stopButton = document.getElementById('stopButton'); this.statusDiv = document.getElementById('status'); // 调试信息元素 this.iceStateEl = document.getElementById('iceState'); this.signalingStateEl = document.getElementById('signalingState'); this.connectionStateEl = document.getElementById('connectionState'); this.trackStateEl = document.getElementById('trackState'); this.videoResolutionEl = document.getElementById('videoResolution'); this.videoFramerateEl = document.getElementById('videoFramerate'); this.lastErrorEl = document.getElementById('lastError'); // 状态变量 this.pc = null; this.statsInterval = null; this.frameCount = 0; this.lastFrameTime = 0; this.lastVideoWidth = 0; this.lastVideoHeight = 0; // 初始化 this.initEventListeners(); } initEventListeners() { // 监听开始连接按钮 连接 this.startButton.addEventListener('click', () => this.connect()); // 监听停止连接按钮 断开连接 this.stopButton.addEventListener('click', () => this.disconnect()); this.videoElement.addEventListener('loadedmetadata', () => { this.updateVideoStats(); }); this.videoElement.addEventListener('error', () => { this.showError('视频元素发生错误'); }); } async connect() { try { this.prepareForConnection(); // 创建PeerConnection this.pc = new RTCPeerConnection( { iceServers: [ { urls: "stun:stun.l.google.com:19302" }, { urls: "stun:stun1.l.google.com:19302" } ] } ); // 设置事件监听 this.setupConnectionEvents(); // 创建并发送Offer const offer = await this.pc.createOffer({ offerToReceiveVideo: true, offerToReceiveAudio: false }); await this.pc.setLocalDescription(offer); // 发送Offer到服务器 const response = await this.sendOfferToServer(offer); // 处理服务器返回的Answer await this.pc.setRemoteDescription( new RTCSessionDescription(response) ); // 开始收集统计信息 this.startStatsCollection(); } catch (err) { this.handleConnectionError(err); } } async sendOfferToServer(offer) { const response = await fetch('http://10.10.23.157:8080/offer', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ sdp: offer.sdp, type: offer.type }) }); if (!response.ok) { throw new Error(`服务器错误: ${response.status}`); } return await response.json(); } prepareForConnection() { this.videoError.style.display = 'none'; this.startButton.disabled = true; this.stopButton.disabled = false; this.updateStatus('正在连接...', 'connecting'); if (this.pc) { this.pc.close(); } } setupConnectionEvents() { this.pc.oniceconnectionstatechange = () => { const state = this.pc.iceConnectionState; this.iceStateEl.textContent = state; if (state === 'connected') { this.updateStatus('连接成功', 'connected'); } else if (state === 'failed') { this.showError('ICE连接失败'); } }; this.pc.onsignalingstatechange = () => { this.signalingStateEl.textContent = this.pc.signalingState; }; this.pc.onconnectionstatechange = () => { const state = this.pc.connectionState; this.connectionStateEl.textContent = state; if (state === 'connected') { this.updateStatus('连接成功', 'connected'); } else if (state === 'disconnected' || state === 'failed') { this.showError('连接断开'); } }; this.pc.ontrack = (event) => { if (event.track.kind === 'video') { this.handleVideoTrack(event); } }; } handleVideoTrack(event) { console.log('收到视频轨道:', event.track); this.trackStateEl.textContent = '活跃'; const stream = new MediaStream(); stream.addTrack(event.track); this.videoElement.srcObject = stream; // 检测视频是否有效 const checkVideoValid = () => { if (this.isVideoBlank()) { this.showError('视频流异常'); } else { this.videoError.style.display = 'none'; this.updateVideoStats(); } if (this.pc && this.pc.connectionState !== 'closed') { setTimeout(checkVideoValid, 1000); } }; checkVideoValid(); } isVideoBlank() { // 简单检测视频是否空白 return this.videoElement.readyState === 0 || (this.videoElement.videoWidth === 0 && this.videoElement.videoHeight === 0); } startStatsCollection() { if (this.statsInterval) clearInterval(this.statsInterval); this.statsInterval = setInterval(async () => { if (!this.pc) return; try { const stats = await this.pc.getStats(); let frameStats = null; stats.forEach(report => { if (report.type === 'inbound-rtp' && report.kind === 'video') { frameStats = report; } }); if (frameStats) { const fps = frameStats.framesPerSecond || 0; this.videoFramerateEl.textContent = `${fps} fps`; } this.updateVideoStats(); } catch (err) { console.error('获取统计信息失败:', err); } }, 1000); } updateVideoStats() { // 更新分辨率 if (this.videoElement.videoWidth > 0 && this.videoElement.videoHeight > 0) { this.videoResolutionEl.textContent = `${this.videoElement.videoWidth}×${this.videoElement.videoHeight}`; } } showError(message) { this.videoError.textContent = message; this.videoError.style.display = 'flex'; this.lastErrorEl.textContent = message; this.updateStatus(message, 'error'); } updateStatus(message, status) { this.statusDiv.textContent = `状态: ${message}`; this.statusDiv.className = `status-${status}`; } handleConnectionError(err) { console.error('连接错误:', err); this.showError(err.message); this.disconnect(); } disconnect() { if (this.pc) { this.pc.close(); this.pc = null; } if (this.statsInterval) { clearInterval(this.statsInterval); this.statsInterval = null; } this.videoElement.srcObject = null; this.startButton.disabled = false; this.stopButton.disabled = true; this.updateStatus('已断开连接', 'waiting'); this.videoError.style.display = 'flex'; this.videoError.textContent = '已断开连接'; // 重置调试信息 this.iceStateEl.textContent = '-'; this.signalingStateEl.textContent = '-'; this.connectionStateEl.textContent = '-'; this.trackStateEl.textContent = '-'; this.videoResolutionEl.textContent = '-'; this.videoFramerateEl.textContent = '-'; } } // 初始化客户端 document.addEventListener('DOMContentLoaded', () => { window.client = new WebRTCClient(); }); </script> </body> </html> <!--const pc = new RTCPeerConnection();--> <!--pc.onaddstream = e => videoElement.srcObject = e.stream;--> <!--const offer = await pc.createOffer();--> <!--await pc.setLocalDescription(offer);--> <!--// 发送offer到服务器的/offer端点--> <!--const response = await fetch('/offer', {--> <!--method: 'POST',--> <!--body: JSON.stringify(pc.localDescription)--> <!--});--> <!--const answer = await response.json();--> <!--await pc.setRemoteDescription(answer);-->以上代码显示视频流异常出现卡顿的原因
08-21
- **问题分析**：服务器端未正确处理 Offer 并返回 Answer，或者 Answer 格式不正确。 - **解决方案**：检查服务器端 `/offer` 接口是否正确返回 SDP Answer。 ```js // 确保服务器返回的 response 是标准的 ...
js和jquery设置disabled属性为true使按钮失效
12-12
设置disabled属性为true即为不可用状态。 JS document.getElementByIdx("btn").disabled=true; jquery $("#btn").attr("disabled", true); html <input type="button" value="提交" id="btn">
禁用（灰化） Button 后提交的问题
weixin_33739646的博客
07-10 283
某些处理响应时间较长，为了防止用户重复连续点击提交按钮，我们通常会在点击之后 disable 此按钮。 在 ASP.NET 2.0 中 asp:button 默认使用客户端浏览器的提交机制即呈现为 input type=submit，如果直接设置 onclientclick="this.disabled=true" ，将无法执行提交。解决方法：只有设置 UseSubmitBehavior=fals...
Vue iview时间组件DatePicker，限制开始时间和结束时间
团长的博客
10-20 1681
这里是用选中的时间去和当前组件UI显示的所有时间进行循环比较，赋予disabled属性。 html模板代码： <FormItem label=""> <Row> <Col span="11"> <DatePicker type="date" :options="startTimeOptions" @on-change="sta...
改变函数中的this的方法
m0_66711291的博客
02-08 556
一般函数中的this指向的是函数的调用者 但也可以用一些方法来改变函数中的this指向 1.call(改变的this指向，参数1，参数2) 2.apply(改变的this指向，[参数1，参数2]) 3.bind(改变的this指向，参数1，参数2) 他们都可以改变this的指向 但是call和apply会立即调用函数，bind不会调用函数，会返回一个新的函数的拷贝 call和apply传递的参数不同，apply的参数必须是数组。 var o = { name:"mu
高阶函数
cake_eat的博客
09-28 281
什么是高阶函数 高阶函数是对其他函数进行操作的函数，它接收函数作为参数或将函数作为返回值输出。 <script> function fn(callback){ callback&&callback(); } fn(function(){alert('hi')} </script> <script> function fn(){ return function() {} } fn(); </script> 此时fn 就是一个高阶函数
绑定点击事件及解绑点击事件
YY的博客
10-20 3381
绑定点击事件及解绑点击事件
防止重复提交表单
tian63364780的专栏
07-06 311
Web表单的一个很大问题就是用户在提交表单的时候会很不耐烦。如果点击提交按钮后，表单没有立即消失（或因网速过慢，没有立即跳转到表单处理页面），用户通常会点好多次提交按钮。于是就产生了一个问题，会造成多次重复的请求，更为糟糕的情况是，可能会多次从你的信用卡里扣钱。 如何解决这个问题呢？解决方法十分简单：当用户第一次点击了提交按钮后，立马将其禁用，当用户想再次点击是，用于提交按钮被禁用而变成灰色，自
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值