根据输入框上的写入动态启用/禁用选择选项

时间:2016-05-03 18:39:31

标签: javascript jquery

我想帮助我,我想在新域输入值时使用函数 禁用域名和私人列表。当在new-private中输入值时也是如此 禁用私人列表。

<h4>domain finder</h4>
<form action="test.php" method="POST">
    <select class="step1" name="domain">
        <option value="">Select a general domain</option>
    </select>
    <select class="step2" name="private">
        <option value="">Select a private area</option>
    </select>
    <label for="new-domain">other general domain</label>
    <input type="text" name="new-domain"></input>
    <label for="new-private">other private area</label>
    <input type="text" name="new-private"></input>
    <button>Submit</button>
</form>

2 个答案:

答案 0 :(得分:0)

使用jquery中的on(&#34; input&#34;)?

// Specify index and key value OR omit for all
function getItems(ind,key) {
var response = [];
var transaction = db.transaction(["items"],"readonly");
var store = transaction.objectStore("items");

// If args are omitted - grab all items
if(!ind | !key) {
    var cursor = store.openCursor();
    cursor.onsuccess = function(e) {
        var res = e.target.result;
        if(res) {
            var r = {
                "name": res.value['name'],
                "url": res.value['url'],
                "folder": res.value['folder'],
                "colour": res.value['colour'],
                "dial": res.value['dial'],
                "order": res.value['order']
            };
            response.push(r);
            res.continue();
        }
        return response;
    }
} else {
    // If both args are specified query specified index
    store = store.index(ind);
    var range = IDBKeyRange.bound(key, key);
    store.openCursor(range).onsuccess = function(e) {
        var res = e.target.result;
        if(res) {
            var r = {
                "name": res.value['name'],
                "url": res.value['url'],
                "folder": res.value['folder'],
                "colour": res.value['colour'],
                "dial": res.value['dial'],
                "order": res.value['order']
            };
            response.push(r);
            res.continue();
        }
        return response;
    }
}
}

非常肯定这是有效的,如果不是谷歌搜索jquery文本输入更改,祝你好运。

答案 1 :(得分:0)

我想我理解你的要求。总结一下:

  1. new-domain输入字段中有任何输入时,您要禁用这两个选择元素。
  2. new-private字段中有输入时,您只想禁用私人列表。
  3. 如果这是正确的,我已经为您设置了Fiddle

    $(function() {
    	$('#new-domain').on('keyup', function() {
      	// Disable both select elements.
        var inputLength = $(this).val().length;
        var $elements = $('.step1, .step2');
        
        if (inputLength > 0) {
        	disableSelectElements($elements, true)
        } else {
        	disableSelectElements($elements, false)
        }
      });
      
      $('#new-private').on('keyup', function() {
      	// Disable just the private list.
        var inputLength = $(this).val().length;
        var $elements = $('.step2');
        
        if (inputLength > 0) {
        	disableSelectElements($elements, true)
        } else {
        	disableSelectElements($elements, false)
        }
      });
    })
    
    var disableSelectElements = function($elements, onOrOff) {
    	$elements.prop('disabled', onOrOff);
    };
    <h4>domain finder</h4>
    <form action="test.php" method="POST">
        <select class="step1" name="domain">
            <option value="">Select a general domain</option>
        </select>
        <select class="step2" name="private">
            <option value="">Select a private area</option>
        </select>
        <label for="new-domain">other general domain</label>
        <input type="text" name="new-domain" id="new-domain" />
        <label for="new-private">other private area</label>
        <input type="text" name="new-private" id="new-private" />
        <button>Submit</button>
    </form>

    基本上我正在做的是将成功的按键输入的监听器附加到这两个输入字段中,并根据需要禁用或重新启用输入字段。我检查长度以确保文本框中确实存在某些内容(如果有人键入字母然后将其删除)并做出相应的响应。

    通过更好地处理您可能在野外遇到的所有各种输入和场景,可以明显改善此功能,但如果是内部工具或原型,则应该完成工作。