表白:黑白圣堂血天使,天劍鬼刀阿修羅。
講解對象:/改變了select options的值但是沒有子菜單跳出來
作者:融水公子 rsgz
===
大家有沒有遇到這樣的情況,已經(jīng)明明改變了這個select options的值了 ,等于說切換到子選項了 ,這個步驟是成功的 但是子選項對應(yīng)的菜單并沒有出來
function find_text(text,yuansu) {
var links = document.querySelectorAll(yuansu);
var elements = Array.prototype.filter.call(links, function(link) {
return link.textContent.includes(text);
});
if (elements.length > 0) {
return elements
}
}
setTimeout(function() {
document.querySelectorAll('input#selectAll')[0].click();
setTimeout(function() {
find_text(text='批量改分類',yuansu='a')[0].click();
setTimeout(function() {
var selectElement = document.querySelector('select#categoryHistoryId');
selectElement.value = '4433'; // 設(shè)置選中的值
}, 1000 * 5);
}, 600);
}, 100);
運行代碼 會幫助自動完成下面的操作
先全選產(chǎn)品,然后點擊批量修改分類,然后切換子選項為 Dresses(連衣裙)
上面的操作都是代碼完成的
但是很明顯的最后一個并沒有成功實現(xiàn)切換子選項。雖然子選項的值切換了,但是這個值對應(yīng)的子菜單并沒有及時的顯示出來等于說切換失敗,是一個偽切換
上面怎么實現(xiàn)我的想法呢?很簡單 加上一個select事件觸發(fā)就行了 代碼修改一下
function find_text(text,yuansu) {
var links = document.querySelectorAll(yuansu);
var elements = Array.prototype.filter.call(links, function(link) {
return link.textContent.includes(text);
});
if (elements.length > 0) {
return elements
}
}
setTimeout(function() {
document.querySelectorAll('input#selectAll')[0].click();
setTimeout(function() {
find_text(text='批量改分類',yuansu='a')[0].click();
setTimeout(function() {
var selectElement = document.querySelector('select#categoryHistoryId');
selectElement.value = '4433'; // 設(shè)置選中的值
selectElement.dispatchEvent(new Event('change')); // 手動觸發(fā)change事件
}, 1000 * 5);
}, 600);
}, 100);
上面就增加了一行 就達到了事件觸發(fā)的效果
selectElement.dispatchEvent(new Event('change')); // 手動觸發(fā)change事件
=== 公眾號:不浪仙人
謝謝大家的支持!可以點擊我的頭像,進入我的空間瀏覽更多文章呢。建議大家360doc[www.360doc.com]注冊一個賬號登錄,里面真的有很多優(yōu)秀的文章,歡迎大家的到來。
---