Jquery图像.attr('src')失败了

时间:2011-07-13 21:37:58

标签: javascript jquery image jquery-mobile

我有一个可折叠时间列表,如“9:00 - 10:00”,附近有一个十字架的图像..当你打开折叠时,有2个输入。如果你填写这个输入,我想做到这一点。交叉更改为支票...但我没有这样做..当我填写输入没有发生任何事情..我不明白什么是错的...给我看我的错误,请...也许问题类似于我之前遇到的问题 - > Jquery Calendar - .attr('id') get wrong value

编辑:我测试了它$(collapsibleID).attr('style' , 'background:green');而不是改变画面,而且它正在工作......不如我想要的那么好但正在工作..问题在于图片声明?

Keydown事件 - >>>>

var collapsibleID = '#'+$('.added').parent('spanTimetable').attr('id');
var pictureID = '#'+$('.checkOrCross').attr('id');

$(collapsibleID).find('.projectName').keydown(
        function() {


    if ($(this).val() != ""
                            && $(collapsibleID).find('.projectEntry')
                                    .val() != "") {
        $(pictureID).attr('src' , 'pics/check.png');

                    }
                })

$(collapsibleID).find('.projectEntry').keydown(
        function() {


    if ($(collapsibleID).find('.projectName').val() != ""
                            && $(this).val() != "") {
        $(pictureID).attr('src' , 'pics/check.png');

                    }
                })

绘制模板 - >>>

function drawTemplate() {
    var selectedValue = parseInt($('#timeDropList').val());

    var textProjectName = '<center>Project Name:</center><center> <input data-theme="c" type="text" class="projectName" value="" /></center>';
    var textProjectData = '<center>Entry:</center><center> <input data-theme="c" style="height:50px;" type="text" class="projectEntry" value="" /></center>';

    var timespan = new Date(2011, 7, 11, 9, 0);

    while (timespan.getHours() < 18 || timespan.getHours() == 18 && timespan.getMinutes() == 0) {
        var hoursFrom = timespan.getHours();
        var minsFrom = timespan.getMinutes();
        if (minsFrom < 10) {
            minsFrom = "0" + minsFrom;
        }
        if (hoursFrom < 10) {
            hoursFrom = "0" + hoursFrom;
        }
        var hoursTo = timespan.getHours();
        var minsTo = timespan.getMinutes() + selectedValue
        if (minsTo == 60) {
            minsTo = "00";
            hoursTo++;
        } else if (minsTo < 10) {
            minsTo = "0" + minsTo;
        }


        var collDiv = '<div class="added" data-theme="c"  data-role="collapsible" id='+hoursFrom+minsFrom+hoursTo+minsTo+' data-collapsed="true"><h3 id="results-header">'
                + hoursFrom
                + ":"
                + minsFrom
                + " - "
                + hoursTo
                + ":"
                + minsTo
                + '<img style="height:15px;width:15px;margin-left:30px;" class="checkOrCross" id='
                +hoursFrom
                +minsFrom
                +hoursTo
                +minsTo
                +' src="pics/cross.png" /></h3>'
                + textProjectName
                + textProjectData
                + '</div>';
        $('.spanTimetable').append(collDiv);
        timespan.setMinutes(timespan.getMinutes() + selectedValue);




    }

HTML-&GT;&GT;

<div data-role="page" id="MSchedule">

    <header data-role="header">
        <h4>Schedule</h4>
    </header>
    <div data-role="content" id="content" style="width: 100%">
        <div class="ui-block-c" id="blockC" style="width: 100%">
            <div id="spanNav">
                <div class="spanNav-rowTimetable" id="spanNav-row1">
                    <select name="timeDropList" id="timeDropList">
                        <option value="6">6 Minutes</option>
                        <option value="10">10 Minutes</option>
                        <option value="15">15 Minutes</option>
                        <option value="30">30 Minutes</option>
                        <option selected value="60">1 Hour</option>
                        <option value="Vac">Vacation</option>

                    </select>

                </div>


            </div>
            <div id="timetable" data-role="collapsible-set"
                class="spanTimetable"></div>
        </div>
    </div>

1 个答案:

答案 0 :(得分:1)

var collapsibleID = '#'+$('.added').parent('spanTimetable').attr('id');
var pictureID = '#'+$('.checkOrCross').attr('id');

什么是'#'+$,你想要达到什么目标?


更新1

此时我并不那么敏锐,但请尝试:

var collapsibleID = '#'+($('.added').parent('.spanTimetable').attr('id'));
var pictureID = '#'+($('.checkOrCross').attr('id'));

它有什么不同吗?


更新2

尝试:

$('input.projectName, input.projectEntry').keydown(function(){
    var $wrapper = $(this).parents('.added'),
        $projectName = $wrapper.find('input.projectName'),
        $projectEntry = $wrapper.find('input.projectEntry');
    if($projectName.val().length > 0 && $projectEntry.val().length > 0){
        $wrapper
            .find('img.checkOrCross')
            .attr('src' , 'pics/check.png');
    }
});